Highcharts/Javascript 中的 3D 饼图

tec*_*ani 3 javascript amcharts highcharts jscharts

我需要在 JavaScript 中绘制 3D 饼图。它应该如下所示:- 3d 饼图

Google 图表、amcharts 和 jscharts 中存在各种用于 3d 饼图的示例,但没有一个如下图所示。

链接:- http://www.amcharts.com/demos/3d-pie-chart/

在 PHP 中,我在这里找到了一个解决方案http://www.advsofteng.com/doc/cdphpdoc/multidepthpie.htm但我想要一些与工具提示支持交互的东西。

请为此推荐任何 javascript 库。我喜欢使用 highcharts,但它甚至不支持简单的 3d 饼图。

谢谢,

Ami*_*oda 5

这是 Highcharts 中最受欢迎的功能。

http://highcharts.uservoice.com/forums/55896-general 看起来我们必须等待一段时间!

支持3D饼图吗?

使用Google 可视化 API,您可以非常轻松地实现这一点。 在此输入图像描述

代码

   <html>
  <head>
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['Task', 'Hours per Day'],
          ['Work',     11],
          ['Eat',      2],
          ['Commute',  2],
          ['Watch TV', 2],
          ['Sleep',    7]
        ]);

        var options = {
          title: 'My Daily Activities',
          is3D: true,
        };

        var chart = new google.visualization.PieChart(document.getElementById('piechart_3d'));
        chart.draw(data, options);
      }
    </script>
  </head>
  <body>
    <div id="piechart_3d" style="width: 900px; height: 500px;"></div>
  </body>
</html>
Run Code Online (Sandbox Code Playgroud)

有关更多功能,请参阅文档https://developers.google.com/chart/interactive/docs/gallery/piechart

希望我对你有帮助:)


Paw*_*Fus 5

好吧,我们现在正在研究 3D 图表,请参阅:

编辑: 它已经随 Highcharts 4.x 版本一起发布,请参阅samples