0

I tried to draw an image on the canvas and then wrap up that canvas as the parameter of another function. But I got error satated that the output of the function imagePK was undefined. Below is my code. Thanks.

The code starts here:

let placemarkAttributes = new WorldWind.PlacemarkAttributes(null);
    placemarkAttributes.imageScale = 0.5;
    placemarkAttributes.imageOffset = new WorldWind.Offset(WorldWind.OFFSET_FRACTION, 0.5,
        WorldWind.OFFSET_FRACTION, 0.5);
    placemarkAttributes.imageColor = WorldWind.Color.WHITE;
    placemarkAttributes.labelAttributes.color = WorldWind.Color.YELLOW;
    placemarkAttributes.labelAttributes.offset = new WorldWind.Offset(
        WorldWind.OFFSET_FRACTION, 0.5,
        WorldWind.OFFSET_FRACTION, 1.0);
    placemarkAttributes.leaderLineAttributes.outlineColor = WorldWind.Color.RED;

    placemarkAttributes = new WorldWind.PlacemarkAttributes(placemarkAttributes);

    console.log(imagePK(300,300, imagePath));
    placemarkAttributes.imageSource = new WorldWind.ImageSource(imagePK(300,300, imagePath));

    // wrap up placemark image source canvas
    let imagePK = function (cWidth, cHeight, imagePath) {
        let canvas = document.createElement("canvas"),
            ctx = canvas.getContext('2d');

        canvas.width = cWidth;
        canvas.height = cHeight;

        let needle = new Image();
        // needle.src = '../images/icons/moldova.png';
        needle.onload = function(){
            ctx.beginPath();
            ctx.moveTo(150, 100);
            ctx.quadraticCurveTo(0, 150,150,200);
            ctx.rect(150,100,10,100);
            ctx.fill();
            ctx.closePath();
            ctx.drawImage(this,150,100,100,100);

            return canvas
        };

        needle.src = imagePath;
    };

0 Answers0