HighCharts 列未知系列数

Question

我正在尝试使用 SQL Classic ASP 服务器的结果填充 HighCharts 数据集。当系列数已知时，一切正常，但对于未知数量的系列，我无法使其正常工作。这是我的 4 系列代码 - 1 行和 3 列。

<script type="text/javascript">

   $(function () {
       var DivName1 = '<%= DivName(1)%>'
       var DivName2 = '<%= DivName(2)%>'
       var DivName3 = '<%= DivName(3)%>'
       var DivName4 = '<%= DivName(4)%>'                    

       var DivN1 = parseInt('<%= DivN(1)%>')
       var DivN2 = parseInt('<%= DivN(2)%>')
       var DivN3 = parseInt('<%= DivN(3)%>')
       var DivN4 = parseInt('<%= DivN(4)%>')                 

       var DivTotal1 = parseFloat('<%= DivTotal(1)%>')
       var DivTotal2 = parseFloat('<%= DivTotal(2)%>')
       var DivTotal3 = parseFloat('<%= DivTotal(3)%>')
       var DivTotal4 = parseFloat('<%= DivTotal(4)%>')



       $('#DivCompTotalA').highcharts({
           chart: {
               type: 'column'
           },
           title: {
               text: ''
           },
           credits: {
               enabled: false
           },
           legend: {
               layout: 'vertical',
               align: 'right',
               verticalAlign: 'top',
               itemWidth: 180,
               useHTML: true,
               x: 0,
               y: 40,
               borderWidth: 0
           },
           xAxis: {
               categories: ['']

           },
           yAxis: {
               max: 7.01,
               labels: {
                   enabled: false
               },
               gridLineColor: 'transparent',

               plotLines: [{

                   value: DivTotal1,
                   color: '#333333',
                   width: 2,

                   label: {
                       text: 'Org.=' + DivTotal1 + '<br>N=' + DivN1,
                       align: 'right',
                       y: -5,
                       x: 0,
                       style: {
                           fontSize: '13px'
                       }
                   },
                   zIndex: 2
               }],
               title: {
                   text: ''
               }

           },

           plotOptions: {
               column: {
                   pointPadding: 0.2,
                   groupPadding: 0.10,
                   borderWidth: 0
               },
               series: {
                   dataLabels: {

                       enabled: true,
                       y: 5,
                       style: {
                            fontSize: '14px'
                        }
                   },
                   enableMouseTracking: false,
                   events: {
                       legendItemClick: function () {
                           return false;
                       }
                   }
               }
           },


           series: [{
               name: DivName2 + ' [' + DivN2 + ']',
               color: '#c9e7ff',
               data: [DivTotal2]
           }, {
               name: DivName3 + ' [' + DivN3 + ']',
               color: '#4898a4',
               data: [DivTotal3]
           }, {
               name: DivName4 + ' [' + DivN4 + ']',
               color: '#ffd949',
               data: [DivTotal4]
           }]
       });
   });

我的第一个问题是如何替换这些行：

var DivName1 = '<%= DivName(1)%>'
var DivName2 = '<%= DivName(2)%>'
var DivName3 = '<%= DivName(3)%>'
var DivName4 = '<%= DivName(4)%>'

有一个循环我试过这个循环但没有成功

var N = '<%=N %>'
    var DivName = []
    for (var i = 0; i <= N; i++) {
        DivName[i] = '<%= DivName(i)%>';
    }

如何在“<%= DivName(i)%>”中写入 "i"，使其成为变体

Answer 1

尝试这样的事情：

将系列设置为空：

series: []

通过脚本填充（其中seriesData是准备好的数据数组。格式检查documentation

$.each(Div, function(i){
    var chart = $('#container').highcharts();
    if (chart.series.length === 1) {
        chart.addSeries({
            name: Div[i].Name + i + ' [' + Div[i].N + ']',
            color: '#c9e7ff',
            data: Div[i].Total
        });
    }
});

这里是 example 如何添加 1 个系列。您可以在每个循环中添加任意数量的内容。

$(function () {
    $('#container').highcharts({
        xAxis: {
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
        },
        series: [{
            data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
        }]
    });

    // the button handler
    $('#button').click(function () {
        var chart = $('#container').highcharts();
        if (chart.series.length === 1) {
            chart.addSeries({
                data: [194.1, 95.6, 54.4, 29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4]
            });
        }
    });
});

HighCharts 列未知系列数

HighCharts column unknown number of series

javascript

asp-classic

highcharts