angularjs - example - highcharts com line
Highcharts-Límite de puntos de datos Treemap (0)
Traté de cargar más de 1000 puntos de datos llamando a una API REST. Pero los puntos de datos no se cargarán (muestra el gráfico de color blanco) cuando excede 1000. Intenté con turboThreshold pero no turboThreshold éxito. ¿Alguna solución para esto? El siguiente es mi código.
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''
}
});
Por favor encuentra mi JSFiddle .