从Zingchart中移除x轴和y轴

Question

从Zingchart中移除x轴和y轴

javascriptchartszingchart

4

我希望完全移除而不是隐藏Zingcharts中的x轴和y轴。我的图表不需要x轴或y轴，虽然我可以隐藏它们，但它们占用了宝贵的空间，导致图表压缩。有没有方法可以实现这一点？

- jlava

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Merrily · Accepted Answer

听起来你可能设置了比例尺为visible:false，但是图表周围仍然有很多空间，这些项目曾经存在。

您可以通过将项目设置为visible:false，将相关的线条颜色属性设置为"none"并添加以下内容来消除此空间：

"plotarea":{ "margin":"0 0" }

在您的JSON中。下面是一个使用上述方法去除间隙的示例。单击“运行代码段”按钮以查看生成的图表。

var myConfig = {
  "type": "line",
  "scale-x":{
    "line-color":"none",
    "item":{
      "visible":false
    },
    "tick":{
      "line-color":"none"
    }
  },
  "scale-y":{
    "line-color":"none",
    "item":{
      "visible":false
    },
    "tick":{
      "line-color":"none"
    }
  },
  "plotarea":{
    "margin":"0 0"
  },
  "series": [
    {
      "values":[20,40,25,50,15,45,33,34]
    },
    {
      "values":[5,30,21,18,59,50,28,33]
    },
    {
      "values":[30,5,18,21,33,41,29,15]
    },
    ]
};

zingchart.render({ 
 id : 'myChart', 
 data : myConfig, 
 height: 400, 
 width: 600 
});

<html>
 <head>
 <!--Assets will be injected here on compile. Use the assets button above-->
  <script src= 'https://cdn.zingchart.com/2.1.2/zingchart.min.js'></script>
  <script> zingchart.MODULESDIR = 'https://cdn.zingchart.com/2.1.2/modules/';</script>
 
 <!--Inject End-->
 </head>
 <body>
  <div id='myChart'></div>
 </body>
</html>

如果您将比例尺设置为 visible:false，可能会引起一些问题。相反，调整样式使它们不可见可以避免与其他功能的冲突。我是 ZingChart 团队的成员，请告诉我这是否回答了您的问题或者您需要更多的解释。