Javascript 如何在amCharts中显示饼图
我想用图表做馅饼。它不显示图表 以下是我的饼图脚本的代码:Javascript 如何在amCharts中显示饼图,javascript,pie-chart,amcharts,Javascript,Pie Chart,Amcharts,我想用图表做馅饼。它不显示图表 以下是我的饼图脚本的代码: <script> var chart1; var chartData1 = [ ]; AmCharts.ready(function () { // SERIAL CHART chart1 = new AmCharts.AmSerialChart(); chart1.dat
<script>
var chart1;
var chartData1 = [
];
AmCharts.ready(function () {
// SERIAL CHART
chart1 = new AmCharts.AmSerialChart();
chart1.dataProvider = chartData1;
chart1.categoryField = "Division";
chart1.startDuration = 1;
chart1.depth3D = 50;
chart1.angle = 45;
chart1.marginRight = 80;
chart1.plotAreaBorderColor = "#DADADA";
// chart3.plotAreaBorderColor = "#DADADA";
chart1.plotAreaBorderAlpha = 0;
//chart8.responsive.enabled = true;
// this single line makes the chart a bar chart
//chart3.rotate = true;
// AXES
// Category
var categoryAxis = chart1.categoryAxis;
categoryAxis.gridPosition = "start";
categoryAxis.labelRotation = 45; // this line makes category values to be rotated
categoryAxis.gridAlpha = 0;
categoryAxis.axisAlpha = 0;
categoryAxis.color = 'red';
// Value
var valueAxis = new AmCharts.ValueAxis();
valueAxis.axisAlpha = 0;
valueAxis.gridAlpha = 0.5;
tickLength: 0;
// valueAxis.minimum = 0;
// valueAxis.maximum = 3.5;
valueAxis.position = "bottom";
valueAxis.color = '';
chart1.addValueAxis(valueAxis);
// GRAPHS
var graph8 = new AmCharts.AmGraph();
graph8.type = "pie";
graph8.title = "Actual";
graph8.valueField = "Actual";
graph8.balloonText = "Actual:[[value]]";
graph8.lineAlpha = 0;
graph8.fillColors = ["#ee8989"];
graph8.fillAlphas = 1;
graph8.labelText = '[[value]]';
graph8.labelRotation = 360;
graph8.labelPosition = 'top-bottom'; // change to inside
graph8.marginRight = 10;
graph8.color = '#000';
graph8.labelColorField = '#FFFFFF';
chart1.addGraph(graph8);
var legend = new AmCharts.AmLegend();
legend = new AmCharts.AmLegend();
legend.position = "bottom";
legend.align = "center";
legend.markerType = "circle";
// legend.labelText = '[[title]]';
chart1.addLegend(legend);
chart1.creditsPosition = "top-right";
// WRITE
chart1.write("piechart");
});
</script>
var-chart1;
var chartData1=[
];
AmCharts.ready(函数(){
//序列图
chart1=新的AmCharts.AmSerialChart();
chart1.dataProvider=chartData1;
图表1.categoryField=“部门”;
图1.startDuration=1;
图1.depth3D=50;
图1.角度=45;
图1.marginRight=80;
图表1.PlotArea BorderColor=“#DADADA”;
//图表3.PlotArea BorderColor=“#DADADA”;
图表1.plotAreaBorderAlpha=0;
//chart8.responsive.enabled=true;
//这条线使图表成为条形图
//图表3.旋转=真;
//斧头
//类别
变量categoryAxis=图表1.categoryAxis;
categoryAxis.gridPosition=“开始”;
categoryAxis.labelRotation=45;//此行用于旋转类别值
categoryAxis.gridAlpha=0;
categoryAxis.axisAlpha=0;
categoryAxis.color='red';
//价值观
var valueAxis=新的AmCharts.valueAxis();
valueAxis.axisAlpha=0;
valueAxis.gridAlpha=0.5;
长度:0;
//valueAxis.minimum=0;
//valueAxis.max=3.5;
valueAxis.position=“底部”;
valueAxis.color='';
图1.添加valueAxis(valueAxis);
//图表
var graph8=新的AmCharts.AmGraph();
graph8.type=“pie”;
图8.title=“实际”;
图8.valueField=“实际”;
graph8.ballootText=“实际值:[[value]]”;
图8.lineAlpha=0;
graph8.FillColor=[“#ee8989”];
图8.1-1;
graph8.labelText='[[value]]';
图8.标签旋转=360;
graph8.labelPosition='top-bottom';//更改为inside
图8.marginRight=10;
图8.color='000';
graph8.labelColorField='#FFFFFF';
图1.添加图(图8);
var legend=new AmCharts.AmLegend();
图例=新的AmCharts.AmLegend();
legend.position=“底部”;
legend.align=“中心”;
legend.markerType=“圆圈”;
//legend.labelText='[[title]]';
图1.添加图例(图例);
图表1.creditsPosition=“右上角”;
//写
图表1.书写(“图表”);
});
这是分区:
<div class="row" style="margin-top: 55px;">
<div class="col-md-12">
<div id="piechart" style="height:450px; width:1300px;"></div>
</div>
</div>
这是我附上的柱形图显示的屏幕截图,但3d-pieChart
不显示。柱状图运行良好
但当我制作饼图时,它显示如下:
请帮我解决这个问题。谢谢您是否收到任何控制台错误?为什么您将图表创建为
AmSerialChart()
而不是PieChart()
?您说我编写PieChart()来解决我的问题,而不是AmSerialChart()@IVOGELOVNo我没有收到控制台错误@Vimal