如何在HTML或Javascript中创建形状

Question

我想创建一个坐标基于查询结果的形状。

例如

$query="SELECT COORDS_X, COORDS_Y from..... ";

然后我将COORDS_X和COORDS_Y的值放在两个变量中。

但我不知道的是Shape的创造。如何创建它并将其坐标分配为COORDS_X和COORDS_Y的值？

是否有人可以协助/帮助解决我的问题？我想把形状放在div上面（div里面有一个图像）。任何帮助将不胜感激。

Answer 1

您可以从AJAX中获取值或在JavaScript中创建变量，然后您可以使用任何画布绘图工具，如Raphael：

http://raphaeljs.com/

小圆圈可以这样绘制：

var cordX=110;
var cordY=35;
var paper = Raphael("sample-1", 200, 75);
var circle = paper.circle(cordX, cordY, 25);
circle.attr({fill: "blue"});

其中sample-1是您想要塑造形状的div的ID。

这是一个小型演示： http://jsfiddle.net/7k8s0f35/

希望这有帮助。