Hi Jeffrey,
In this case, you have to use custom code to get the desired visualization. You can use the following custom code or insert your series data directly in the custom options.
Code: Select all
var newSeries = [{data:[]}];
var newData = newSeries[0].data;
var lines = options.data.csv.split('\n');
Highcharts.each(lines, function(line, lineNo) {
var items = line.split(';');
newData.push({
x: parseInt(items[0]),
y: parseInt(items[1]),
label: items[2].slice(1, items[2].length-1)
});
});
delete options.data.csv;
options.series = newSeries;
Highcharts.extend(options, Highcharts.merge(options, {
// custom options
}));
Preview:
https://cloud.highcharts.com/show/uk3pgzme1
Alternative way, that is working in the editor preview as well:
Code: Select all
var labels = [
"Coal",
"Coal (IGCC)",
"Natural Gas Combustion Turbine",
"Natural Gas Steam Generator",
"Natural Gas Combined Cycle",
"Coal (with carbon capture)",
"Coal (IGCC with carbon capture)",
"Natural Gas Combined Cycle (with carbon capture)",
"Solar (CSP)",
"Nuclear (typ. Gen II)",
"Nuclear (small modular reactor)",
"Solar (PV)"
];
Highcharts.extend(options, Highcharts.merge(options, {
tooltip:{
formatter: function(){
return '<b>'+ labels[this.point.index]+'</b>' +
'<br/>' + this.series.xAxis.userOptions.title.text + ': <b>' + this.x + '</b>'+
'<br/>' + this.series.yAxis.userOptions.title.text + ': <b>'+ this.y + '</b> ';
}
},
// other custom options
}));
Preview:
https://cloud.highcharts.com/show/gnZeB5Kma
Best regards,
Sophie