Estoy tratando de representar el gráfico con la imagen usando pointStyle. Implementé este gráfico en el lado del cliente y funciona bien, pero cuando trato de representar el gráfico usando nodejs (SSR), solo muestra el gráfico sin una imagen.

Código Nodejs

 var express = require("express"); const { Canvas, loadImage } = require("canvas"); const { CanvasRenderService } = require("chartjs-node-canvas"); var router = express.Router(); async function initChartData() { const img = await loadImage("https://i.imgur.com/yDYW1I7.png"); const canvas = new Canvas(img.width, img.height); var ctx = canvas.getContext("2d"); ctx.drawImage(img, 0, 0, img.width, img.height); console.log('<img src="' + canvas.toDataURL() + '" />'); const data = { labels: ["Jan", "Feb", "Mar", "Apr", "May", "Jun"], datasets: [ { label: "Tokyo", fill: false, borderColor: "rgba(75,192,192,1)", pointBackgroundColor: "#fff", pointRadius: 5, pointStyle: '<img src="' + canvas.toDataURL() + '" />', // or ['',img,'','','',''] data: [0, 7, 8, 14, 18, 22], }, ], }; const configuration = { type: "line", data: data, options: { responsive: false, animation: false, maintainAspectRatio: false, }, }; return configuration; } const mkChart = async (params) => { const conf = await initChartData(); const canvasRenderService = new CanvasRenderService(400, 400); return await canvasRenderService.renderToBuffer(conf); }; router.get("/", async function (req, res, next) { var image = await mkChart(req.query); res.type("image/png"); res.send(image); }); module.exports = router;

Paquete.json

 "dependencies": { "canvas": "^2.8.0", "chart.js": "^3.5.1", "chartjs-node-canvas": "^3.2.0", "cookie-parser": "~1.4.4", "express": "~4.16.1", }

Demostración del lado del cliente: https://jsfiddle.net/3t1qguy7/1/ Repositorio https://github.com/ahmedosamaalam/node-chartjs/tree/main