AnyChart如何快速创建3D饼图和圈图（含代码）

最新推荐文章于 2022-08-01 14:38:31 发布

weixin_30786617

最新推荐文章于 2022-08-01 14:38:31 发布

阅读量191

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/kjyj/p/4704175.html

版权

AnyChart如何快速创建3D饼图和圈图

在新发布的7.6.0版本中，AnyChart已经支持3D的饼图和圈图了，这篇文章主要介绍如何使用JavaScript创建3D的饼图和圈图，AnyChart提供了AnyChart.pie3d()函数用于创建饼图，具体可以查看下面的代码：

Anychart试用版本下载地址：http://www.componentcn.com/kongjianchanpin/tubiao/jibentubiaokongjian/2014-09-15/161.html

详细代码如下

<html>

<head>

<script src="//cdn.AnyChart.com/js/7.6.0/AnyChart-bundle.min.js"></script>

<style>
    html, body, #container {
      width: 100%;
      height: 100%;
      margin: 0;
      padding: 0;
    }
</style>

</head>

AnyChart.onDocumentReady(function() {

// create pie chart with passed data

chart = AnyChart.pie3d([

['Department Stores', 6371664],

['Discount Stores', 7216301],

['Men\'s/Women\'s Stores', 1486621],

['Juvenile Specialty Stores', 786622],

['All other outlets', 900000]

]);

// set container id for the chart

chart.container('container');

// set chart title text settings

chart.title('ACME Corp. apparel sales through different retail channels');

// set legend title text settings

chart.legend(true);

chart.legend().title('Retail channels');

// set legend position and items layout

chart.legend().position('bottom');

chart.legend().itemsLayout('horizontal');

chart.legend().align('center');

// initiate chart drawing

chart.draw();

});

</script>

</body>

</html>

更多问题可以直接联系：QQ593638308

转载于:https://www.cnblogs.com/kjyj/p/4704175.html