如何使用JavaScript在x/y位置绘制点数

我想以二维方式绘制点（每个点都有x和y坐标）。我想知道你是否知道这样做的库或项目，这样我就不必从头开始构建它。如何使用JavaScript在x/y位置绘制点数

来源

2009-10-02 Tam

你需要轴吗？给点的上下文？ – 2009-10-02 16:15:43

是的......实际上我需要展示更多像是一个除了轴线之外还分成四个象限的正方形 – Tam 2009-10-02 16:19:17

您使用的是'

这里有一个： http://jsdraw2d.jsfiction.com/

来源

2009-10-02 16:20:19

Raphaël - 一个小型的JavaScript库，应简化在网络上矢量图形的工作。

来源

2009-10-02 16:21:18

使用canvas标签是做到这一点的最佳方式。下面是创建一个Canvas的例子：

// Create a canvas that extends the entire screen 
 
// and it will draw right over the other html elements, like buttons, etc 
 
var canvas = document.createElement("canvas"); 
 
canvas.setAttribute("width", window.innerWidth); 
 
canvas.setAttribute("height", window.innerHeight); 
 
canvas.setAttribute("style", "position: absolute; x:0; y:0;"); 
 
document.body.appendChild(canvas); 
 

 
//Then you can draw a point at (10,10) like this: 
 

 
var ctx = canvas.getContext("2d"); 
 
ctx.fillRect(10,10,1,1);

此外，你可以操纵使用的ImageData在屏幕上的所有像素。

https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Drawing_shapes

来源

2009-10-04 04:38:33 jhuni

矩形很容易找到，如果它有点大，你可以尝试'ctx.fillRect（10,10,10,10）; ' – kkron 2015-03-08 02:33:41

如果你使用jQuery已经，然后Flot是绘制图表非常非常简单（但功能强大）的方式。

你也可以看看Google Charts API - 保证跨浏览器：它给你一个图形为图像，而不是帆布或VML等

来源

2009-10-04 04:55:43 nickf