Javascript 使用Canvas/HTML5创建或显示N-QAM星座

我需要通过网页创建一个QAM星座图。我将给出一个X，Y或复数。我试图寻找一些示例代码来帮助我绘制这个图，但没有成功。最接近的是散点图。有什么建议吗？

这里是一些x，y坐标的示例图。网格从左上角的0,0开始，正x向右移动，正y向下移动

函数绘图（）{
var can=document.getElementById（'can'）；
var ctx=can.getContext（'2d'）；
var w=罐宽；
var h=罐高；
ctx.fillStyle=“rgb（40,90150）”；
ctx.fillRect（0,0,w,h）；
var中心w=数学楼层（w/2）；
var center_h=数学楼层（h/2）；
ctx.beginPath（）；
ctx.strokeStyle=“rgb（255255）”
//画轴
ctx.moveTo（0，中心位置）；
ctx.lineTo（西、中、高）；
ctx.moveTo（中心w，0）；
ctx.lineTo（中心西，高）；
//画圈
var半径=20；
var起始角=0；
var end_角=360；
var to_弧度=Math.PI/180；
ctx.移动到（中心w+半径，中心h）；
ctx.弧（中心w、中心h、半径、开始角*到弧度、结束角*到弧度）；
ctx.stroke（）；
ctx.beginPath（）；
ctx.fillStyle=“rgb（255255,0）”；
//绘图坐标
变量坐标=[
[center_w，center_h]，
[10, 10],
[10, 60],
[10, 110],
[10, 160],
[60, 10],
[110, 10],
[160, 10]
];
对于（变量i=0；i
您至少应该给出您将提供的输入和您期望的输出。这很好。我只需要担心缩放和坐标映射。谢谢