如何在XYSplineRenderer图形中将正方形变为点的形状

// 假设你使用的是D3.js库
const renderer = new XYSplineRenderer();
renderer.pointSize(1); // 设置点的大小为1像素

// 假设你使用的是Chart.js库
const ctx = document.getElementById('myChart').getContext('2d');
const myChart = new Chart(ctx, {
    type: 'scatter',
    data: {
        datasets: [{
            label: 'My First dataset',
            backgroundColor: 'rgb(255, 99, 132)',
            borderColor: 'rgb(255, 99, 132)',
            data: [
                {x: 10, y: 20},
                {x: 15, y: 25},
                // 更多数据点...
            ],
        }]
    },
    options: {
        scales: {
            x: {
                type: 'linear',
                position: 'bottom'
            },
            y: {
                type: 'linear',
                position: 'left'
            }
        }
    }
});

class PointRenderer {
    render(data) {
        data.forEach(point => {
            // 绘制单个点
            // 假设canvas上下文为ctx
            ctx.beginPath();
            ctx.arc(point.x, point.y, 1, 0, 2 * Math.PI);
            ctx.fill();
        });
    }
}

const renderer = new PointRenderer();
renderer.render(data); // data是你的数据点数组