jQuery Highcharts，性能问题，需要解决的想法 [英] Jquery Highcharts, performance issues, need ideas to fix

问题描述

您好，我正在制作一个查询工具，该工具将查看大量数据并通过 Highcharts 进行查看.我的查询工具可让您选择各种标签进行查看.然后，当您选择要查看的所有标签时，它将在日期范围内收集这些点.它查询大数据集，Highcharts变得非常混乱.当然，我有zoomable选项，但是我想知道如何像上面链接的示例一样快速进行缩放.我认为性能问题取决于客户端.

以下是我的代码.我将所有结果收集到一个数组数组中.然后，我将其传递给函数以填充我的高图表.

Hi I am making a query tool that will view large sets of data and viewing it through Highcharts. My query tool allows you to choose a variety of tags to look at. Then when you choose all of the tags you want to look at, it gathers those points within a date range. It queries large data sets and Highcharts becomes really choppy. Of course I have the zoomable option, but I want to know how to make it fast like the example I linked above. I believe the performance issue relies on the client side.

The following is my code. I gather all my results into an array of arrays. Then I pass it into a function to fill my high charts.

success: function (data) {
                    var information = new Array();
                    $.each(data, function (listnum) {
                        var list = new Array();
                        $.each(this, function (index) {
                            var dtinfo = this.DateCollected;
                            var part = dtinfo.split(" ");
                            var date = part[0].split("/");
                            var year = date[2];
                            var day = date[1];
                            var month = date[0];
                            var time = part[1].split(":");
                            var hour = time[0];
                            var min = time[1];
                            var sec = time[2];
                            var point = [Date.UTC(year, month, day, hour, min, sec), this.FValue];
                            list[index] = point;
                        });
                        information[listnum] = list;
                    });
                    $("#GraphLoadBut").removeClass("load").addClass("notload");
                    $("#accordion").multiAccordion({ active: 2 });
                    fillChart(information, tagNames, pointRange, colors);

                }
            });
        });

        function fillChart(information, tagNames, pointRange, colors) {
            var length = information.length;
            for (var i = 0; i < length; i++) {
                var series = { data: information[i] };
                series.name = tagNames[i];
                series.pointInterval = pointRange[i];
                if (colors[i] != "") {
                    series.color = "#" + colors[i];
                }
                options.series.push(series);
            }
            var chart = new Highcharts.Chart(options);
        }

有什么想法可以优化吗?我认为这是客户端方面的问题.

我获取的数据是JSON

Any ideas how I can optimize this? I believe it is a client side problem.

The data I am getting is JSON

推荐答案

.each(data，>功能(列表编号){ var list = 新 数组();

.each(data, function (listnum) { var list = new Array();

.each(此，函数(索引){ var dtinfo = this .DateCollected; var part = dtinfo.split(" ); var date = part [ 0 ].split(" /"); var year = date [ 2 ]; var day = date [ 1 ]; var month = date [ 0 ]; var time = part [ 1 ].split(" :"); var hour = time [ 0 ]; var min = time [ 1 ]; var sec = time [ 2 ]; var point = [日期 .UTC(年，月，日，小时，分钟，秒)，此 .FValue]； list [index] = point; }); information [listnum] =列表； });

.each(this, function (index) { var dtinfo = this.DateCollected; var part = dtinfo.split(" "); var date = part[0].split("/"); var year = date[2]; var day = date[1]; var month = date[0]; var time = part[1].split(":"); var hour = time[0]; var min = time[1]; var sec = time[2]; var point = [Date.UTC(year, month, day, hour, min, sec), this.FValue]; list[index] = point; }); information[listnum] = list; });

(" ).removeClass (" ).addClass(" 未加载");

("#GraphLoadBut").removeClass("load").addClass("notload");

这篇关于jQuery Highcharts，性能问题，需要解决的想法的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！