1

我正在使用 JSON 对象提供的数据在画布上绘制线条：

var data = { values:[
{ X: "04-28", Xt: "7:45 pm", Ys: 116, Yd: 74, Yp: 0},
{ X: "04-29", Xt: "2:00 am", Ys: 112, Yd: 73, Yp: 0},
//

使用一点 jQuery 来画线：

c.lineWidth = 4;
c.strokeStyle = '#f00';
c.beginPath();
c.moveTo(getXPixel(0), getYPixel(data.values[0].Ys));
for(var i = 1; i < data.values.length; i ++) {
    c.lineTo(getXPixel(i), getYPixel(data.values[i].Ys));
}
c.stroke();

要绘制多条线（以处理“Yd”和“Yp”以及以后可能需要的任何其他线），我想将该位移动到一个函数中，我可以使用以下方法调用它：

drawLine(4, '#f00', 'Ys');

我试过的功能：

function drawLine(width, style, d) {
    c.lineWidth = width;
    c.strokeStyle = style;
    c.beginPath();
    c.moveTo(getXPixel(0), getYPixel(data.values[0].d));
    for(var i = 1; i < data.values.length; i ++) {
        c.lineTo(getXPixel(i), getYPixel(data.values[i].d));
    }
    c.stroke();
}

不工作。没有错误，但没有画线。如果我将“Ys”直接放在函数中，它确实有效。我如何将该位作为参数传递？

4

1 回答 1

3

你不想要 的d属性，你想要持有values[i]的字符串值的属性。d您需要使用obj[d]，而不是obj.d像：

function drawLine(width, style, d) {
    c.lineWidth = width;
    c.strokeStyle = style;
    c.beginPath();
    c.moveTo(getXPixel(0), getYPixel(data.values[0][d]));
    for(var i = 1; i < data.values.length; i ++) {
        c.lineTo(getXPixel(i), getYPixel(data.values[i][d]));
    }
    c.stroke();
}

例如：

var obj = { a:1, b:2, c:3 };
console.log(obj.a);    // 1
console.log(obj['a']); // 1    
var a = 'b';
console.log(obj.a);    // 1, still
console.log(obj[a]);   // 2, because the var a == 'b' as if:
console.log(obj['b']); // 2
于 2013-06-20T23:22:48.473 回答