this question similar 1 (highcharts parsed drilldown not showing on page in console) trying things different (that 1 works (thanks pawel/salman), i'm asking new question). creating column chart multiple series drilldown. data comes csv file (the jsfiddle uses mockup, pawel on how that).
i need series set in highcharts api [name: x, data[{name: y, y: z, drilldown: id}]]. problem have series appears in log correct series of arrays data in format required, data not being pushed actual series[]. have modified code below , in jsfiddle: https://jsfiddle.net/49jlf4xo/1/.
$('#container').highcharts({ chart: { type: 'column', events: { load: function () { var csvdata = document.getelementbyid("data").innerhtml; var lines = csvdata.split('\n'); var drilldown = { series: [] }; var seriesdata = []; $.each(lines, function (lineno, line) { if (lineno > 0 && lineno < 4) { var items = line.split(','); var seriesname = string(items[0]); // area name var area_cost = parsefloat(items[1]); // area rollup var drill_id = string(items[2]); // id of drilldown var shift_one_value = parsefloat(items[3]); // drilldown shift1 value var shift_two_value = parsefloat(items[4]); // drilldown shift2 value if (!isnan(area_cost) && !isnan(shift_one_value) && !isnan(shift_two_value)) { seriesdata.push({ name: seriesname, data: ({ name: seriesname, y: area_cost, drilldown: drill_id }) }); drilldown.series.push({ id: drill_id, data: [ ["shift1", shift_one_value], ["shift2", shift_two_value] ] }); } } }); drilldown = drilldown; series = [seriesdata]; console.log(series); } }, title: { text: 'my title here' }, xaxis: { type: 'category' }, yaxis: { title: { text: 'value here' } }, legend: { enabled: false }, tooltip: { shared: true, crosshairs: true }, plotoptions: { series: { borderwidth: 0, datalabels: { enabled: true }, colorbypoint: true } }, series: [], drilldown: { drillupbutton: { relativeto: 'spacingbox', position: { y: 0, x: 0 }, theme: { fill: 'white', 'stroke-width': 1, stroke: 'silver', r: 0, states: { hover: { fill: '#bada55' }, select: { stroke: '#039', fill: '#bada55' } } } }, allowpointdrilldown: false, activeaxislabelstyle: { textdecoration: 'underline', fontstyle: 'italic' }, activedatalabelstyle: { textdecoration: 'none', fontstyle: 'italic' } } } }); where data of format
<div id="data">area,value,type,shift1,shift2 blog1,50000,blog1_shift,5,6 blog2,60000,blog2_shift,2,3 blog3,40000,blog3_shift,7,8 </div> i don't have enough rep post image of console, looks this: don't have enough rep post image of console, "series" looks data below.
overall shows: [object array] [array[3]] 0 1 2 where first (0) expands this:
[object array] [array[3]] 0 [object array][...] 0 [object object] {...} [functions] __proto__ [object object] {...} data [object object] {...} [functions] __proto__ [object object] {...} drilldown "blog1_shift" name "blog1" y 50000 name "blog1" it same other 2 arrays.
i getting nothing title on screen, nothing else shows up.
i have tried putting in .addseries, few things similar posts , got me no further have idea going wrong this? appreciated.
thanks
div data doesn't formatted. data of series must array, not object. series in load event array array of arrays - loose top array nesting not needed (e.g. use series = seriesdata; instead of series = [seriesdata];). adding series chart? drilldown series not added. looks better load , parse data first , create chart data set in specified chart's options structure.
working example: http://jsfiddle.net/jqmjwb8z/
Comments
Post a Comment