我尝试通过调用REST API来加载超过1000个数据点。但是当数据点超过1000时,数据点将不会加载(显示白色图表)。我尝试使用turboThreshold
但未成功。对此有何解决方案?以下是我的代码。
var data = {
'TotalSales': {
'Cat1': {
'Subcat1':{
'Prod1': '200',
'Prod2': '500',
'Prod3': '300'
},
'Subcat2':{
'Prod1': '400',
'Prod2': '100',
'Prod3': '600'
}
},
'Cat2': {
'Subcat1':{
'Prod1': '200',
'Prod2': '500',
'Prod3': '300'
},
'Subcat2':{
'Prod1': '400',
'Prod2': '100',
'Prod3': '600'
}
},
'Cat3': {
'Subcat1':{
'Prod1': '100',
'Prod2': '200',
'Prod3': '300'
}
},
'Cat4': {
'Subcat1':{
'Prod1': '100',
'Prod2': '200',
'Prod3': '300'
}
},
'Cat5': {
'Subcat1':{
'Prod1': '200',
'Prod2': '500',
'Prod3': '300'
},
'Subcat2':{
'Prod1': '400',
'Prod2': '100',
'Prod3': '600'
}
}
}
},
points = [],
allP,
allVal,
allI = 0,
catP,
catI,
subcatP,
subcatI,
prodP,
prodI,
all,
cat,
subcat,
prod,
prodName = {
'Prod1': 'Product1',
'Prod2': 'Product2',
'Prod3': 'Product3'
};
for (all in data) {
if (data.hasOwnProperty(all)) {
allVal = 0;
allP = {
id: 'id_' + allI,
name: all,
color: "green"
};
catI = 0;
for (cat in data[all]) {
if (data[all].hasOwnProperty(cat)) {
catP = {
id: allP.id + '_' + catI,
name: cat,
parent: allP.id,
color: "blue"
//color: Highcharts.getOptions().colors[catI]
};
points.push(catP);
subcatI = 0;
for (subcat in data[all][cat]) {
if (data[all][cat].hasOwnProperty(subcat)) {
subcatP = {
id: catI+ '_' + subcatI,
name: subcat,
//color: Highcharts.getOptions().colors[subcatI],
color: "yellow",
parent: catP.id
};
points.push(subcatP);
prodI = 0;
for (prod in data[all][cat][subcat]) {
if (data[all][cat][subcat].hasOwnProperty(prod)) {
prodP = {
id: subcatP.id + '_' + prodI,
//name: prodName[prod],
name : prod,
parent: subcatP.id,
//color: Highcharts.getOptions().colors[prodI],
color: "red",
value: Math.round(data[all][cat][subcat][prod])
};
allVal += prodP.value;
points.push(prodP);
prodI = prodI + 1;
}
}
subcatI = subcatI + 1;
}
}
catI = catI + 1;
}
}
allP.value = Math.round(allVal);
points.push(allP);
allI = allI + 1;
}
}
Highcharts.chart('container', {
plotOptions: {
series: {
turboThreshold: 0 // Comment out this code to display error
}
},
series: [{
type: 'treemap',
layoutAlgorithm: 'squarified',
//layoutAlgorithm: 'sliceAndDice',
allowDrillToNode: true,
//animationLimit: 1500,
dataLabels: {
enabled: false
},
levelIsConstant: false,
levels: [{
level: 1,
//layoutAlgorithm: 'sliceAndDice',
dataLabels: {
enabled: true
},
borderWidth: 3
}],
data: points
}],
subtitle: {
text: 'Click points to drill down. Source: <a href="http://apps.who.int/gho/data/node.main.12?lang=en">WHO</a>.'
},
title: {
text: 'Global Mortality Rate 2012, per 100 000 population'
}
});
请找到我的JSFiddle。