Amchart json url饼图不出现答案

【问题标题】：Amchart json url pie chart does not occurAmchart json url饼图不出现
【发布时间】：2018-03-05 08:47:31
【问题描述】：

首先，我对使用 JavaScript 非常陌生。我正在尝试使用 Amchart 库创建一个饼图，但该图表没有出现。这不是科斯。 Microsoft 已添加到与 asp.net.cors 一起使用。我认为数据来自集合。如果我将我的评分固定为百分比，我认为错误将得到解决。你能提出一个解决方案吗？谢谢这是我的代码。怎么了？

<title> trying pie chart</title>
<meta name="description" content="chart created using amCharts live editor" />

<!-- amCharts javascript sources -->
<script src="https://www.amcharts.com/lib/3/amcharts.js" type="text/javascript"></script>
<script src="https:http://cdn.amcharts.com/lib/3/pie.js" type="text/javascript"></script>
<script src="https://www.amcharts.com/lib/3/themes/black.js" type="text/javascript"></script>
<script src="https://www.amcharts.com/lib/3/plugins/dataloader/dataloader.min.js"></script>


<!-- amCharts javascript code -->
<script type="text/javascript">
    AmCharts.makeChart("chartdiv",
        {
            "type": "pie",
            "theme": "black",
            "dataLoader": {
                "url": "https://s3-us-west-2.amazonaws.com/s.cdpn.io/218423/data1.json",
                "format": "json",
                "angle": 20.7,
                "balloonText": "[[title]]<br><span style='font-size:14px'><b>[[value]]</b> ([[percents]]%)</span>",
                "depth3D": 9,
                "labelRadius": 16,
                "labelText": "[[percents]]%",
                "labelTickAlpha": 0,
                "outlineAlpha": 0.49,
                "outlineThickness": 1,
                "titleField": "country",
                "valueField": "visits",
                "handDrawScatter": 0,
                "handDrawThickness": 0,
                "theme": "black",
                "allLabels": [],
                "balloon": {},
                "legend": {
                    "enabled": true,
                    "align": "center",
                    "markerType": "circle"
                }

            }
        });

</script>

代码在这里

【问题讨论】：

标签： javascript json graph pie-chart amcharts

【解决方案1】：

您的dataLoader 定义包含太多属性。从您的代码中，它只需要url 和可选的format 属性；其余属性属于图表本身。

下面的固定代码：

AmCharts.makeChart("chartdiv",
{
        "type": "pie",
        "theme": "black",
        "dataLoader": {
            "url": "https://s3-us-west-2.amazonaws.com/s.cdpn.io/218423/data1.json",
            "format": "json"
        },
        "angle": 20.7,
        "balloonText": "[[title]]<br><span style='font-size:14px' <b>[[value]]</b> ([[percents]]%)</span>",
        "depth3D": 9,
        "labelRadius": 16,
        "labelText": "[[percents]]%",
        "labelTickAlpha": 0,
        "outlineAlpha": 0.49,
        "outlineThickness": 1,
        "titleField": "country",
        "valueField": "visits",
        "handDrawScatter": 0,
        "handDrawThickness": 0,
        "theme": "black",
        "allLabels": [],
        "balloon": {},
        "legend": {
            "enabled": true,
            "align": "center",
            "markerType": "circle"
        }
});

请注意，由于 codepen 的 CORS 限制（URL 指向的位置），您还需要在服务器上托管数据。

【讨论】：