为同一图形中的两个散点图指定颜色

// 创建Canvas元素
var canvas = document.createElement('canvas');
document.body.appendChild(canvas);

// 获取Canvas上下文
var ctx = canvas.getContext('2d');

// 定义散点图数据
var data1 = [
  { x: 10, y: 20 },
  { x: 30, y: 40 },
  { x: 50, y: 60 }
];

var data2 = [
  { x: 70, y: 80 },
  { x: 90, y: 100 },
  { x: 110, y: 120 }
];

// 定义颜色
var color1 = 'red';
var color2 = 'blue';

// 绘制散点图
function drawScatterPlot(data, color) {
  ctx.fillStyle = color;

  for (var i = 0; i < data.length; i++) {
    var point = data[i];
    ctx.beginPath();
    ctx.arc(point.x, point.y, 5, 0, 2 * Math.PI);
    ctx.fill();
  }
}

// 调用函数绘制两个散点图
drawScatterPlot(data1, color1);
drawScatterPlot(data2, color2);