Joe Riggs
Joe Riggs

Reputation: 1324

Highchart Data from HTML table with line series

Heres and example loading from an html table

http://jsfiddle.net/gh/get/jquery/1.9.1/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/column-parsed/

I want to use that with but also allow for different series type

http://jsfiddle.net/gh/get/jquery/1.9.1/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/combo-dual-axes/

I was thinking about adding a checkbox column that would indicate a line series but am unsure how to correctly pass that to this function

data: {
    table: document.getElementById('datatable')
},

Any other links to this feature/api would also be appreciated

Upvotes: 0

Views: 4118

Answers (2)

Mark
Mark

Reputation: 108522

This is a lot of effort just to have some checkboxes in the data table but here you go. I've leveraged the parsed callback of the data options to parse out the checkboxes and set the series type from them:

      data: {
            table: document.getElementById('datatable'),
            parsed: function(){
                var checkBoxes = $('#typeRow input'); //find checkboxes
                for (var i = 0; i < checkBoxes.length; i++){
                    this.columns[i+1].pop(); // remove checkbox row, this will break highcharts parsing
                    if (checkBoxes[i].checked){                                           
                        this.chartOptions.series[i]['type'] = 'line'; //set the series type
                    }
                    else
                    {
                        this.chartOptions.series[i]['type'] = 'column';
                    }
                }
            }
        },

Here's a working fiddle.

Upvotes: 1

Paweł Fus
Paweł Fus

Reputation: 45079

I don't know what do you want to do with that checkbox, but in general you can predefine series options like this:

    series: [{
        yAxis: 0
    }, {
        type: 'spline',
        yAxis: 1
    }]

Example: http://jsfiddle.net/4mb9k/

Upvotes: 0

Related Questions