SVG Text Not Working

[jdgamble555]

I'm loading an SVG with Text like so:

const svgImage = `<svg width="1200" height="630" xmlns="http://www.w3.org/2000/svg">
<rect width="100%" height="100%" fill="blue"/>
<text x="50%" y="50%" font-family="Arial" font-size="40" fill="white"
 text-anchor="middle" alignment-baseline="middle">test</text>
</svg>`;

const canvas = createCanvas(1600, 900);
const ctx = canvas.getContext('2d');

const encoder = new TextEncoder();
const svgBuffer = encoder.encode(svgImage);

//const svgBuffer = Buffer.from(svgImage);
const img = await loadImage(svgBuffer);
ctx.drawImage(img, 0, 0);
const buffer = canvas.toBuffer('image/png');

// print buffer as image...

This prints no text, however, if I add it from the canvas, it works fine:

  // Set text style
  ctx.font = "bold 120px Verdana";
  ctx.textAlign = "center";
  ctx.fillStyle = "white";
  ctx.textBaseline = 'middle';

  let centerX = canvas.width / 2;
  let centerY = canvas.height / 2;

  ctx.fillText('Test', centerX, centerY);

How do I get the SVG text to work?

J

[Brooooooklyn]

Fixed in #780