Ich habe folgendes Script:
Aber das Bild wird nicht ausgegeben. Weis jemand wieso nicht. Ich möchte erreichen, dass ein bestimmtes Bild welches ich über eine Image instanziere zu einem späteren Zeitpunkt ausgegeben wird. Das ganze soll später in eine seperate Klasse, die das image zeichnet ausgelegt werden.
Code:
@Component({ selector: 'app-canvas', template: `<canvas #canvas width="600" height="300"></canvas>`, styles: ['./canvas.component.css'] }) export class CanvasComponent implements OnInit { @ViewChild('canvas', { static: true }) canvas: ElementRef<HTMLCanvasElement>; private ctx: CanvasRenderingContext2D; constructor() { } ngOnInit() { this.ctx = this.canvas.nativeElement.getContext('2d'); this.draw(); } draw(): void { var image = new Image(); image.src = 'https://www.landschaftspark.de/site/assets/files/9906/lapano_info.675x338.jpg'; // Beispiel Bild this.ctx.drawImage(image, 675, 338); } }
Kommentar