无法使用Highchart绘制两个饼图

我想通过进行两个ajax调用(因为两个图表都基于不同的数据集)并使用动态数据并排绘制两个饼图,但总是我只得到一个图表而不是第二个不知道我在哪里犯错误。 我的代码如下所示。 请帮我画两张彼此相邻的图表。

function visitorData(data, type) { var chartData = JSON.parse(data.d); var data1 = ""; var chartAlign = ""; if (type == 0) { data1 = [{ name: chartData.Table[0].RegName, y: chartData.Table[0].IC, id: 8 }, { name: chartData.Table[1].RegName, y: chartData.Table[1].IC, id: 4 }, { name: chartData.Table[2].RegName, y: chartData.Table[2].IC, id: 7 }, { name: chartData.Table[3].RegName, y: chartData.Table[3].IC, id: 6 }]; chartAlign = '15%'; } else if (type == 1) { data1 = [{ name: chartData.Table[0].InvStyleName, y: chartData.Table[0].LatestPercent }, { name: chartData.Table[1].InvStyleName, y: chartData.Table[1].LatestPercent }, { name: chartData.Table[2].InvStyleName, y: chartData.Table[2].LatestPercent }, { name: chartData.Table[3].InvStyleName, y: chartData.Table[3].LatestPercent }, { name: chartData.Table[4].InvStyleName, y: chartData.Table[4].LatestPercent }]; chartAlign = '75%'; } var chart = Highcharts.chart('container', { chart: { renderTo: 'container', // plotBackgroundColor: null, type: 'pie', plotBorderWidth: 1, plotShadow: false, plotLeft: 100, }, tooltip: { pointFormat: '{series.name}: {point.percentage:.1f}%', }, plotOptions: { pie: { allowPointSelect: false, cursor: 'pointer', innerSize: 50, depth: 45, shadow: false, states: { hover: { enabled: false }, }, dataLabels: { color: 'grey', distance: 10, connectorWidth: 0, connectorPadding: 0 } }, }, exporting: { buttons: { contextButtons: { enabled: false, menuItems: null } }, enabled: false }, credits: { enabled: false }, series: [] }); chart.addSeries({ "data": data1, size: 100, top: 20, center: [chartAlign] }); } $(document).ready(function () { $.ajax({ type: "POST", url: "Default.aspx/GetGeo", data: '{name: "' + "manish" + '" }', contentType: "application/json; charset=utf-8", dataType: "json", success: function (data) { visitorData(data, 0); } }); $.ajax({ type: "POST", url: "Default.aspx/GetInvStyles", data: '{name: "' + "manish" + '" }', contentType: "application/json; charset=utf-8", dataType: "json", success: function (data) { visitorData(data, 1); } }); }); 

您只在一个容器上创建高图。要显示两个饼图,您已经给出两个continer container1container2并初始化为

 var chart1 = Highcharts.chart('container1', {...}) and var chart2 = Highcharts.chart('container2', {...}) 

小提琴链接