Я попытался использовать библиотеку Fabric.js, чтобы нарисовать на холсте HTML5, но она ничего не делает. Это угловой проект 19. < /P>
этого кода должно быть достаточно, чтобы использовать ткань?
ngAfterViewInit() {
this.log.debug(`[FractalComponent] ngAfterViewInit`)
const width = (this.fractalCanvasContainer.nativeElement as HTMLDivElement).clientWidth;
const height = (this.fractalCanvasContainer.nativeElement as HTMLDivElement).clientHeight;
console.log(`[FractalComponent] fractalCanvas ${JSON.stringify(this.fractalCanvas)}`)
this.canvas = new Canvas(this.fractalCanvas.nativeElement, {
width: width,
height: height,
backgroundColor: '#000000',
selection: false,
preserveObjectStacking: true,
isDrawingMode: true,
});
const text = new FabricText('Fabric.JS', {
left: 0,
top: 0,
cornerStrokeColor: 'blue',
cornerColor: 'lightblue',
cornerStyle: 'circle',
padding: 10,
transparentCorners: false,
cornerDashArray: [2, 2],
borderColor: 'orange',
borderDashArray: [3, 1, 3],
borderScaleFactor: 2,
});
const text1 = new FabricText('Hello Fabric', {
left: 50,
top: 30,
fontSize: 24,
fill: '#336699'
});
this.canvas.add(text1);
this.canvas.add(text);
this.canvas.centerObject(text);
this.canvas.setActiveObject(text);
console.log(`[FractalComponent] ${JSON.stringify(this.canvas)}`)
}
< /code>
Но цвет фона не установлен, текст не добавлен. Ничего не работает. /> Редактировать: после удаления фона стиля из CSS результат выглядит так:
ther />
itsstatic.net/65nk5 проблема Firefox. В Chrome теперь выглядит нормально: < /p>
Firefox: 141.0.3 (64-бит)
chromium: версия 139.0.7258.66 (официальная сборка) для Mint Linux (64-битный) < /p>
Подробнее здесь: https://stackoverflow.com/questions/797 ... the-canvas
