Javascript 使用HIghchart和JSON生成三维饼图
我正在尝试使用HighChart生成一个3d饼图,数据是JSON格式的。虽然我启用了3D,但它似乎只生成2d 我正在尝试生成这样的三维饼图 有人能告诉我我在下面的代码中遗漏了什么吗Javascript 使用HIghchart和JSON生成三维饼图,javascript,jquery,highcharts,Javascript,Jquery,Highcharts,我正在尝试使用HighChart生成一个3d饼图,数据是JSON格式的。虽然我启用了3D,但它似乎只生成2d 我正在尝试生成这样的三维饼图 有人能告诉我我在下面的代码中遗漏了什么吗 <script src="http://code.highcharts.com/highcharts.js"></script> <script src="http://code.highcharts.com/modules/exporting.js"></scri
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<script src="code.highcharts.com/highcharts-3d.js"></script>
$(document).ready(function() {
var options = {
chart: {
renderTo: 'chart1',
type: 'pie',
options3d: {
enabled: true,
alpha: 15,
beta: 15,
depth: 50,
viewDistance: 25
}
},
title: {
text: '',
// x: -20 //center
},
subtitle: {
text: '',
// x: -20
},
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
},
legend: {
// layout: 'vertical',
// align: 'right',
// verticalAlign: 'top',
// x: -10,
// y: 100,
// borderWidth: 0
enabled:false
},
series: []
}
$.getJSON("data1.json", function(json) {
options.xAxis.categories = json[0]['data'];
options.series[0] = json[1];
options.series[1] = json[2];
chart = new Highcharts.Chart(options);
});
});
您可以看到3d饼图在该区域中工作。我已经用你的json数据更新了笔 您的选项中唯一缺少的是:
plotOptions: {
pie: {
depth: 25
}
}
如果查看,您会发现某些图表不仅需要发送图表属性,还需要打印选项
而不同图表类型的某些特定设置可以在plotOptions下找到
您是否包含了
?当我使用此页面中的示例3d饼图数据时,您发布的代码运行良好:可能是数据或json的原因?这是一支代码笔,你能展示一下你正在生成的JSON样本吗?我不能生成3d,但我可以生成2D图表。我已经包含了highchart库和json数据。你可以给我看任何一个饼图的exmaple,只要它使用json数据,谢谢你的工作。。如何显示选定饼图并将标签切片更改为本演示中您可以看到的其他内容:如何格式化数据以及如何格式化plotoptions中的数据标签。{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:'专有或不可检测',y:0.2}
plotOptions: {
pie: {
depth: 25
}
}