在ZingChart上自定义x轴

时间:2015-07-19 20:19:17

标签: javascript visualization zingchart

我想使用ZingChart绘制与此类似的图表: r-graph

我能做的最好的事情是: zing-graph

周守军:

{ 
  "graphset": [{
    "type": "line",
    "series": [
        {
            "values":[[1,218.2], [2,121.7], [4,62.27], [8,34.37], [16,19.79], [20,16.52], [32,17.1], [40,16.11], [64,91.9]]
        }
    ],
    "scale-x":{
        "values":[1,2,4,8,16,20,32,40,64]
    }
  }]
}

如何将x-ticks的位置固定为与x值相同?

1 个答案:

答案 0 :(得分:5)

首先,您需要在max-items对象中设置items-overlapscale-x属性,以强制显示比例尺中的所有项目。

"scale-x":{
    "max-items":9999, //forces all items 
    "items-overlap":true, //forces items (labels) to show even when overlapping
    /* Code truncated for brevity */

之后,在alpha对象和item对象中将tick(透明度)设置为0,以隐藏所有刻度和项目。通过在rulesitem的{​​{1}}数组中配置对象,仅显示要显示的项目,以显示所需的比例值。

tick

我是ZingChart团队的成员。请查看this demo并告诉我是否可以回答有关其工作原理的任何问题。