Highcharts 中文社区

查看: 1639|回复: 2

[JS 数据处理] JS 循环addSeries数据量大造成卡屏怎么解决 !!新手帮下忙

[复制链接]
  • TA的每日心情

    2017-5-31 09:38
  • 签到天数: 4 天

    [LV.2]偶尔看看I

    5

    主题

    15

    帖子

    64

    积分

    HC 新手

    Rank: 1

    积分
    64
    发表于 2017-4-24 17:27:54 | 显示全部楼层 |阅读模式
    var chart5=  Highcharts.chart('chart5', {
                chart: {
                    type: 'spline'
                },
                title: {
                    text: '单元轨放散图'
                },
                credits: {
                    enabled:false
                },
                chart: {
                    zoomType: 'x',
                    type: 'line'
                },
                legend:{enabled:false},
                xAxis: {
                    gridLineWidth: 0,//设置横向分区线宽度
                    lineColor:'#FFFFFF',//设置y轴颜色
                   title: {
                        text: ''
                    },
                    labels:{
                        enabled:false
                    }
                },
                yAxis: {
                    gridLineWidth: 0,//设置横向分区线宽度
                    lineColor:'#FFFFFF',//设置y轴颜色
                    title: {
                        text: ''
                    },
                    max: 5,
                    labels: {
                        formatter:function(){
                            if(this.value ==3) {
                                return "实际单元轨上行";
                            }else if(this.value ==4) {
                                return "设计单元轨上行";
                            }else if(this.value ==1) {
                                return "实际单元轨下行";
                            }else if(this.value ==2) {
                                return "设计单元轨下行";
                            }else{
                                return "";
                            }
                        }
                    },
                    min: 0
                },
                series: [{
                    animation: false,
                    color:'#A9A9A9',
                    name: '',
                    lineWidth: 4,
                    data:[[1,3],[60,3]]
                },{
                    animation: false,
                    color:'#A9A9A9',
                    name: '',
                    lineWidth: 4,
                    data:[[1,1],[60,1]]
                }]
            });

    for(var i=0;i<pointList.length;i++){
                var serviceObject=new Object();
                serviceObject.lineWidth=4;
                if(pointList.hasOwnProperty("uData")){
                    serviceObject.color='#00FF00';
                    var data=[];
                    data.push([pointList['startPoint'],3]);
                    data.push([pointList['endPoint'],3]);
                    serviceObject.data=data;
                }else if(pointList.hasOwnProperty("u2Data")){
                    serviceObject.color='#000000';
                    var data=[];
                    data.push([pointList['startPoint'],4]);
                    data.push([pointList['endPoint'],4]);
                    serviceObject.data=data;
                }else if(pointList.hasOwnProperty("dData")){
                    serviceObject.color='#00FF00';
                    var data=[];
                    data.push([pointList['startPoint'],1]);
                    data.push([pointList['endPoint'],1]);
                    serviceObject.data=data;
                }else if(pointList.hasOwnProperty("d2Data")){
                    serviceObject.color='#000000';
                    var data=[];
                    data.push([pointList['startPoint'],2]);
                    data.push([pointList['endPoint'],2]);
                    serviceObject.data=data;
                }
                chart5.addSeries(serviceObject);
            }


    我是从后台读取数据传到JS然后循环添加series 测试过不是后台查询数据的问题
    这是浏览器卡的 QQ图片20170424172550.png




    [img]file:///C:\Users\Lee\AppData\Roaming\Tencent\Users\1027236295\QQ\WinTemp\RichOle\}}@}R8UJ(N1G8(FM[M1M3Q2.png[/img][img]file:///C:\Users\Lee\AppData\Roaming\Tencent\Users\1027236295\QQ\WinTemp\RichOle\}}@}R8UJ(N1G8(FM[M1M3Q2.png[/img]


  • TA的每日心情
    开心
    2019-12-18 13:31
  • 签到天数: 750 天

    [LV.10]以坛为家III

    14

    主题

    867

    帖子

    1万

    积分

    HC 神人

    看我签名看我签名看我签名看我签名看我签名看我签名看我签名看我

    Rank: 8Rank: 8

    积分
    11545

    最佳新人活跃会员热心会员发帖之王突出贡献论坛元老

    发表于 2017-4-24 18:00:28 | 显示全部楼层
    第二个参数设 false ,即循环过程中不要重绘,循环结束时 redraw

    addSeries (Object options, [Boolean redraw], [Mixed animation])

    https://api.hcharts.cn/#Chart.redraw
    https://api.hcharts.cn/#Chart.addSeries
    请用HCode:  http://code.hcharts.cn/ 创建一个在线实例重现你的问题,然后分享链接,便于共同调试。
  • TA的每日心情

    2017-5-31 09:38
  • 签到天数: 4 天

    [LV.2]偶尔看看I

    5

    主题

    15

    帖子

    64

    积分

    HC 新手

    Rank: 1

    积分
    64
     楼主| 发表于 2017-4-24 17:34:28 | 显示全部楼层
    这是正常出现的图形 微信图片_20170424173147.png
    您需要登录后才可以回帖 登录 | 立即注册

    本版积分规则

    关闭

    站长推荐上一条 /1 下一条

    快速回复 返回顶部 返回列表