0
我想使用SVG Raphael制作线条图。这已经使用画布执行了。在画布中绘制直线曲线时,将执行moveTo以定位直线的第一个点,然后对连续点应用for循环以使用lineTo绘制直线。但我不知道如何在Raphael中应用这个。 是否可以在paper.path方法中插入for循环?该数据如下:定位SVG路径后使用for循环绘制线条
var x1 = pts[0],
y1 = pts[1],
x2 = pts[i]*scaleX,
y2 = pts[i+1]*scaleY;
的代码应该遵循这个思路:
paper.path("M" + x1 + "," + x2);
//then a for loop
for(var i=2;i<pts.length-1;i+=2){
paper.path("L" + x2 + "," + y2);
}
我知道的语法是完全错误的,上述但多数民众赞成的什么做的基本思想。有什么办法可以执行这个吗?
编辑:实际使用的代码如下这给误差对象#没有方法“路径”
var linedataline = [{dataPoints : [{ x: 0,
y: 0
}, {
x: 20,
y: 20
}, {
x: 35,
y: 25
}, {
x: 26,
y: 32
}, {
x: 47,
y: 40
}, {
x: 42,
y: 47
}, {
x: 65,
y: 68
}, {
x: 85,
y: 88
}, {
x: 110,
y: 120
}]
},
{dataPoints : [{ x: 0,
y: 0
}, {
x: 5,
y: 40
}, {
x: 15,
y: 70
}, {
x: 25,
y: 90
}, {
x: 36,
y: 110
}, {
x: 55,
y: 125
}, {
x: 68,
y: 135
}, {
x: 75,
y: 100
}, {
x: 120,
y: 30
}]
}];
而对于画线的功能是:
function drawCurveLine(paper, dataline, series, name){
for(var i=0; i<dataline.length; i++){
var x1 = dataline[i].dataPoints[i].x * paper.scaleX,
y1 = dataline[i].dataPoints[i].y * paper.scaleY;
var s = "M" + x1 + "," + y1;
for(var j=0; j<dataline[i].dataPoints.length;j++){
var x2 = dataline[i].dataPoints[j].x * paper.scaleX,
y2 = dataline[i].dataPoints[j].y * paper.scaleY;
s += " L" + x2 + "," + y2;
}
paper.path(s).attr({stroke: "000", "stroke-width": 3});
}
}
感谢您的建议。我试了一下,但它给出了错误对象#
也许你已经创建了一个名为paper的变量,它隐藏了raphael纸张对象。猜测虽然问题可能在你没有发布的代码中。 –
问题已解决,谢谢您的帮助! –