Question

我使用javascript创建了一个饼图，我的数据存储在mongodb中。在我的图表中，我可以分开饼图片。

这就是每当我在显示数据的任何切片上滚动鼠标时。

但我的要求是，如果我点击它的任何一部分，它应该在某个表格中显示数据。

这是我的HTML代码

<html>
<head>
<title>Pie chart</title>
<script type="text/javascript" src="fusioncharts/fusioncharts.js"></script>
<script type="text/javascript" src="fusioncharts/fusioncharts.charts.js"></script>
<script type="text/javascript" src="fusioncharts/themes/fusioncharts.theme.zune.js"></script>


<script type="text/javascript">
FusionCharts.ready(function(){
    var revenueChart = new FusionCharts({
      type: "pie2d",
      renderAt: "chart-container",
      width: "450",
      height: "350",
      dataFormat: "json",
      dataSource: {
          "chart": {
              "caption": "Split of Visitors by Age Group",
              "subCaption": "Last year",
              "paletteColors": "#0075c2,#1aaf5d,#f2c500,#f45b00,#8e0000",
              "bgColor": "#ffffff",
              "showBorder": "0",
              "use3DLighting": "0",
              "showShadow": "0",
              "enableSmartLabels": "0",
              "startingAngle": "0",
              "showPercentValues": "1",
              "showPercentInTooltip": "0",
              "decimals": "1",
              "captionFontSize": "14",
              "subcaptionFontSize": "14",
              "subcaptionFontBold": "0",
              "toolTipColor": "#ffffff",
              "toolTipBorderThickness": "0",
              "toolTipBgColor": "#000000",
              "toolTipBgAlpha": "80",
              "toolTipBorderRadius": "2",
              "toolTipPadding": "5",
              "showHoverEffect":"1",
              "showLegend": "1",
              "legendBgColor": "#ffffff",
              "legendBorderAlpha": '0',
              "legendShadow": '0',
              "legendItemFontSize": '10',
              "legendItemFontColor": '#666666'
          },
          "data": [
              {
                  "label": "Teenage",
                  "value": "1250400"
              }, 
              {
                  "label": "Adult",
                  "value": "1463300"
              }, 
              {
                  "label": "Mid-age",
                  "value": "1050700"
              }, 
              {
                  "label": "Senior",
                  "value": "491000"
              }
          ]
      }
  });
    revenueChart.render("chart-container");
});

</script>
</head>
<body>
<div id="chart-container"></div>
</body>
</html>

Answer 1

我知道多年前就已经问过了这个问题，但任何可能碰到这个问题的人都可以看到 HERE 。

您必须使用link属性，如here所示。

               "link": "JavaScript:populate('411');",

如何使用javascript创建饼图

1 个答案: