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

回答1:

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.

回答2:

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/

来源：https://stackoverflow.com/questions/21294266/highchart-data-from-html-table-with-line-series

标签

Highcharts