使用Jquery动态更改轴标签



我正在研究这个zingchart:

    var myConfig = {
        type: "line",
        plot:{
            aspect:"spline"
        },
      //...... legend, preview...
        "scale-x":{
                "format":"%v",
                "zooming":true,
                "label":{
                    "id": "xlabel",
                    "text":"X",
                    "margin-top":100
                },
                "item":{
                    "auto-align":true,
                    "maxChars":10
                },
                "tick":{
                    "line-color":"black",
                    "line-width":"2px",
                    "size":8
                } 
        },
        "scale-y":{
                "zooming":true,
                "decimals":0,
                "label":{
                    "id": "ylabel",
                    "text":"Y",
                    "margin-top":100
                }
        },
        series: [
                { "values": [
                        [1,10],
                        [2,20],
                        [3,50],
                        [4,60]
                    ]
                },
                { "values": [
                        [1,3],
                        [2,7],
                        [3,15],
                        [4,30],
                        [5,70],
                        [3.2,25]
                    ]
                }
            ]
    };

我已经修改了图表以添加绘图等。但是,尝试动态修改 X 轴和 Y 轴的标签时出现错误。我正在使用 JQuery 包装器,并根据更新对象我这样做:

$('#myChart').updateObject({
             "type": "label",
                "data": {
                    "id": "xlabel",
                    "text": "My new label"
                }
            });

但这引发了一个错误:Uncaught TypeError: Cannot read property 'length' of undefined这部分(我知道它是最小化的,除非你开发 zingchart,否则不会有太大意义):

 for (z = 0, b = p.length; z < b; z++) {

case "updateobject":

不确定我是否正确使用了对象更新,但这就是文档中它的工作方式。我可能缺少任何想法?

编辑:我无法在这个 jsfiddle 中重现发病率,但我也无法让它工作。

编辑2:

我认为它涉及到这一点,它将p设置为undefined

case "updateobject":
    r = n.BY(e[ZC._[3]]);
    if (r && e.data) {
        r.G["objects.updates"] = []; //G = "label"
        G = e.type || "label";  // e = Object {type: "label", data: Object}
        p = r.o[G + "s"];   // p = undefined, r = e {b: undefined, M9: "zcgraph", MW: "linegraph", o: Object, G: Object…}

r.o是:

o: Object
background-color: "#ffffff"
height: 502
legend: Object
plot: Object
plotarea: Object
preview: Object
scale-x: Object
scale-y: Object
series: Array[2]
tween: null
type: "line"
width: 755
x: 0
y: 0
__proto__: Object

此演示展示了UpdateObject工作的示例:

var myConfig = {
    'type':'line',
    'series':[
        {
            'values':[11,26,7,44,11]
        }
    ],
    'labels':[
       {
            'id':'label1',
           'text':'Label 1',
            'x':50,
          'y':50,
          'background-color':'#f90',
           'padding':5
      },{
          'id':'label2',
           'text':'Label 2',
            'x':150,
         'y':50,
          'background-color':'#f09',
           'padding':5
      }
    ],
    'shapes':[
      {
            'id':'shape1',
           'x':100,
         'y':100,

似乎会找到labels下的物体(这就是为什么我在p = r.o[G + "s"]+"s"之前看到的原因)。这可能意味着我使用了错误的方法修改"scale-x"内的标签。

$("#myChart").modify({
    "data": {
         "scale-x":{
            "label":{
                "id": "xlabel",
                "text":"My new label",
            }
        }
    }
});  

相关内容

  • 没有找到相关文章

最新更新