来自HTML表格和线条系列的Highchart数据 [英] Highchart Data from HTML table with line series

问题描述

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

我想使用它，但也允许使用不同的系列类型

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

我正在考虑添加一个复选框列，表示一系列行，但我不确定如何正确把这个函数传递给这个函数：

$ p $ data：{
table：document.getElementById（'datatable'）
}，


此功能的任何其他链接也将被赞赏

解决方案

为了在数据表中有一些复选框，这是一个很大的努力，但在这里你去。我利用数据选项的解析回调来解析出复选框并从中设置系列类型：

  data：{
 table：document.getElementById（'datatable'），
 parsed：function ）{
 var checkBoxes = $（'＃typeRow input'）; //找到复选框
 for（var i = 0; i< checkBoxes.length; i ++）{
 this.columns [i + 1] .pop（）; //删除复选框行，这将打破highcharts解析
 if（checkBoxes [i] .checked）{
 this.chartOptions.series [i] ['type'] ='line'; //设置系列类型
} 
 else 
 {
 this.chartOptions.series [i] ['type'] ='column'; 
} 
} 
} 
}，
  

这是一个有效的小提琴。

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

解决方案

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.

这篇关于来自HTML表格和线条系列的Highchart数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！