Javascript 从外部JSON创建饼图不起作用

我有以下代码来生成饼图。我调用一个外部json文件来生成饼图。 出于某种原因。它不会生成饼图。我错过了什么或做错了什么

下面是我的代码：

<div id="container" style="min-width: 310px; height: 400px; max-width: 600px; margin: 0 auto"></div>

---

我们到了。pie json数据需要转换，如下所示：

var选项={
图表：{
renderTo:'容器'，
键入“pie”，
选项3D：{
启用：对，
阿尔法：15，
贝塔：15，
深度：50，
视距：25
}
},
标题：{
文本：“”，
},
副标题:{
文本：“”，
},
xAxis：{
类别：[]
},
亚克斯：{
启用：false，
标题：{
文本：“金额”
},
标签：{
//格式化程序：函数（）{
//返回Highcharts.numberFormat（this.value，0，，，，，）；
//                            }
//，已启用：false
},
绘图线：[{
值：0，
宽度：1，
颜色：'#808080'
}]
},
工具提示：{
格式化程序：函数（）{
返回“+this.series.name+”
+
this.x+'：$'+Highcharts.numberFormat（this.y，0，，，，，）；
}
},
学分：{
已启用：false
},
打印选项：{
馅饼：{
allowPointSelect:true，
光标：“指针”，
深度：35，
数据标签：{
启用：对，
格式：“{point.name}”
}
}
},
图例：{
已启用：false
},
系列：[{type:“pie”}]
}
setTimeout（函数（）{
$.getJSON（“pie.json”，函数（json）{
log（json）；
警报（json）；
options.series[0].data=json；
图表=新的高点图表。图表（选项）；
});
}, 0);
我们到了。pie json数据需要转换，如下所示：


var选项={
图表：{
renderTo:'容器'，
键入“pie”，
选项3D：{
启用：对，
阿尔法：15，
贝塔：15，
深度：50，
视距：25
}
},
标题：{
文本：“”，
},
副标题:{
文本：“”，
},
xAxis：{
类别：[]
},
亚克斯：{
启用：false，
标题：{
文本：“金额”
},
标签：{
//格式化程序：函数（）{
//返回Highcharts.numberFormat（this.value，0，，，，，）；
//                            }
//，已启用：false
},
绘图线：[{
值：0，
宽度：1，
颜色：'#808080'
}]
},
工具提示：{
格式化程序：函数（）{
返回“+this.series.name+”
+
this.x+'：$'+Highcharts.numberFormat（this.y，0，，，，，）；
}
},
学分：{
已启用：false
},
打印选项：{
馅饼：{
allowPointSelect:true，
光标：“指针”，
深度：35，
数据标签：{
启用：对，
格式：“{point.name}”
}
}
},
图例：{
已启用：false
},
系列：[{type:“pie”}]
}
setTimeout（函数（）{
$.getJSON（“pie.json”，函数（json）{
log（json）；
警报（json）；
options.series[0].data=json；
图表=新的高点图表。图表（选项）；
});
}, 0);

head部分是否添加了JQuery库？console中有哪些错误？@liontass Yes JQuery存在。它也没有给出任何错误。它只是因为某种原因而不会呈现饼图..F12，控制台中有什么？@mkaatman它没有在series属性的控制台集上给出任何错误图表的类型：series:[{type:“area”}]是否在head部分添加了JQuery库？控制台中有什么错误？@liontass Yes JQuery在那里。它也没有给出任何错误。它只是因为某种原因而不会呈现饼图..F12，控制台中有什么？@mkaatman它没有在控制台集上的series属性上给出任何错误图表的类型：series:[{type:“area”}]
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/js/bootstrap.min.js"></script>

        <!-- high chart libarary -->

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/highcharts-3d.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>

    <script>


     var options = {
       chart: {
         renderTo: 'container',
         type: 'pie',
         options3d: {
           enabled: true,
           alpha: 15,
           beta: 15,
           depth: 50,
           viewDistance: 25
         }
       },
       title: {
         text: '',
       },
       subtitle: {
         text: '',
       },
       xAxis: {
         categories: []

       },
       yAxis: {
         enabled: false,
         title: {
           text: 'Amount'
         },
         labels: {
           //                            formatter:function() {
           //                              return Highcharts.numberFormat(this.value, 0, '', ',');
           //                            }
           //                        ,enabled: false
         },
         plotLines: [{
           value: 0,
           width: 1,
           color: '#808080'
         }]
       },
       tooltip: {
         formatter: function() {
           return '<b>' + this.series.name + '</b><br/>' +
             this.x + ': $' + Highcharts.numberFormat(this.y, 0, '', ',');
         }
       },
       credits: {
         enabled: false
       },
       plotOptions: {
         pie: {
           allowPointSelect: true,
           cursor: 'pointer',
           depth: 35,
           dataLabels: {
             enabled: true,
             format: '{point.name}'
           }
         }
       },
       legend: {
         enabled: false
       },

       series: [{}]
     }

     setTimeout(function() {

           $.getJSON("pie.json", function(json) {
//                options.xAxis.categories = json[0]['data'];
//                options.series[0] = json[1];
//                options.series[1] = json[2];
//                chart = new Highcharts.Chart(options);
                  //  debugger
                console.log(json);
                alert(json);

       options.series[0].data = json
       chart = new Highcharts.Chart(options);
            });





     }, 0)


    </script>

 [{
       name: 'Microsoft Internet Explorer',
       y: 56.33
     }, {
       name: 'Chrome',
       y: 24.03,
       sliced: true,
       selected: true
     }, {
       name: 'Firefox',
       y: 10.38
     }, {
       name: 'Safari',
       y: 4.77
     }, {
       name: 'Opera',
       y: 0.91
     }, {
       name: 'Proprietary or Undetectable',
       y: 0.2
 }]