Question

我必须根据所选复选框的数量渲染具有不同系列数的折线图（每个复选框名称在折线图中显示为一系列）。我观察到，当sql为两个系列返回超过121行时，折线图不会渲染。

我根据sql查询中的列数（选中的复选框数）创建json。我尝试添加turboThreshold，但无济于事。下面是创建json和highchart的代码：

function f() {
var json = "";
var j = "";
var fcol = [];
var cols = [];
var collen = "";

var one = [];
var two = [];
var three = [];
var four = [];
var five = [];

var six = [];
var seven = [];
var eight = [];
var nine = [];
var ten = [];

for(i = 0; i < result.length; i++) {
      if (j == 0) {
            fcol.push(result[i][0]);
      }
}
//alert(fcol);
fcol = JSON.stringify(fcol);
  for(var i = 0; i < result.length; i++) {
        collen = result[i].length;
        //alert(result[i].length);
      for(j = 1; j < result[i].length; j++) {
          cols.push(this.metadata[j]['colName']);
        }
        cols = cols.slice(0,collen-1);
    }
//alert(cols);
for(i = 0; i < result.length; i++) {
      if (j = 1) {
            one.push(result[i][1]);
      }
}

for(i = 0; i < result.length; i++) {
      if (j = 2) {
            two.push(result[i][2]);
      }
}

for(i = 0; i < result.length; i++) {
      if (j = 3) {
            three.push(result[i][3]);
      }
}

for(i = 0; i < result.length; i++) {
      if (j = 4) {
            four.push(result[i][4]);
      }
}

for(i = 0; i < result.length; i++) {
      if (j = 5) {
            five.push(result[i][5]);
      }
}

for(i = 0; i < result.length; i++) {
      if (j = 6) {
            six.push(result[i][6]);
      }
}

for(i = 0; i < result.length; i++) {
      if (j = 7) {
            seven.push(result[i][7]);
      }
}

for(i = 0; i < result.length; i++) {
      if (j = 8) {
            eight.push(result[i][8]);
      }
}

for(i = 0; i < result.length; i++) {
      if (j = 9) {
            nine.push(result[i][9]);
      }
}

for(i = 0; i < result.length; i++) {
      if (j = 10) {
            ten.push(result[i][10]);
      }
}
var marr = [];
marr.push(one);
marr.push(two);
marr.push(three);
//alert('three'+marr);
marr.push(four);
//alert('four'+marr);
marr.push(five);

marr.push(six);
marr.push(seven);
marr.push(eight);
marr.push(nine);
marr.push(ten);

**for(i = 0; i < collen-1; i++) {
            if (i == (collen-2)) {
                json+='{"name":"'+cols[i]+'","data":['+marr[i]+']}';
                }
            else {
                json+='{"name":"'+cols[i]+'","data":['+marr[i]+']},';
                }
}
var y = "["+json+"]";**

 $('#iChartMultiStationReport').highcharts({
        chart: {
            renderTo: 'iChartMultiStationReport',
            type: 'line',
            margin: 75,
            zoomType: 'xy',
        },
        title: {
            text: 'Line Chart'
        },
        subtitle: {
            text: 'Testing'
        },
                xAxis: {
                    type: 'category',
                    categories: $.parseJSON(fcol),//$.parseJSON($("body").data("xaxis"))
                    labels: {   align: 'left',
                                            x: -5,
                                            y: 65,
                                            style: {
                                                fontFamily: 'Arial',
                                                fontSize: '8pt',
                                                color: '#000000',
                                                //textOverflow:'none', //I changed these two lines
                                                whiteSpace: 'nowrap'

                                            }
                                        }
            },
        **plotOptions: {
            series: {
                turboThreshold: 10000000000
            }
        },**
                series: $.parseJSON(y)//$.parseJSON($("body").data("yaxis"))
                //$.parseJSON(document.getElementById('container').getAttribute('yaxis'))

    });
}

请提供您宝贵的意见。谢谢。

Answer 1

Highchart对行数没有任何限制。

整个折线图无法渲染或只渲染部分线条？如果渲染了某些行，则检查数据中是否存在任何空值，并将这些空值传递给缺少行的高图

注意：jsfiddle可能有助于以有效的方式解决您的问题。

当sql返回超过121行时，Highcharts折线图不会呈现

1 个答案: