angularjs – 具有两个Y轴的角度图表库

发布时间：2020-12-17 17:44:02 所属栏目：安全来源：网络整理

导读：是否有任何Angular库,我可以在同一个图上绘制两个Y轴(例如左边一个,右边另一个)？我在 chinmaymk和 jtblin之前尝试过库,但还没有找到合适的方法. 谢谢. 解决方法 var chartData = { "type":"mixed","title":{ "text":"Multiple Y Axis" },"scale-x":{ },"sc

是否有任何Angular库,我可以在同一个图上绘制两个Y轴(例如左边一个,右边另一个)？
我在 chinmaymk和 jtblin之前尝试过库,但还没有找到合适的方法.
谢谢.

解决方法

var chartData = {
            "type":"mixed","title":{
                "text":"Multiple Y Axis"
            },"scale-x":{
                
            },"scale-y":{
                "values":"0:50:5"
            },"scale-y-2":{
                "values":"0:40000:5000","guide":{
                    "visible":false
                }
            },"series":[
                {
                    "values":[8,31,12,40,24,20,16,9],"type":"bar","scales":"scale-x,scale-y","hover-state":{
                        "visible":false
                    }
                },{
                    "values":[11254,26145,17014,2444,17871,25658,34002,26178,20413],"type":"line",scale-y-2"
                }
            ]
        };

zingchart.render({
  id: "chart",data: chartData,width: "100%"
 });

#chart {
  width: 100%;  
}

<script src="http://cdn.zingchart.com/zingchart.min.js"></script>
<div id="chart"></div>

ZingChart支持带有scale-y-n对象的多个y轴.在Github上也有一个易于使用的Angular directive.

在片段和here’s a more real world example中有一个简单的演示.您可以右键单击图表本身并选择“查看源”以查看JSON.

如果您对实施有任何疑问,请随时与我联系 – 我是ZC团队的成员.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!