• JQuery图形插件,Highcharts平滑线条处理方法


    第一种:静态数据

    $('#THChartDiv').highcharts({
        chart: {
            type: 'spline'
        },
        title: {
            text:过程线'
    },
        xAxis: {
        title: {
                text: 'X'
        }
    },
    yAxis: {
        title: {
                text: 'Y'
        }
    },
    tooltip: {
        enabled: true,
        formatter: function () {
            return 'this.y + '' + this.x;
        }
    },
    legend: {
        enabled: false
    },
    plotOptions: {
        line: {
                dataLabels: {
                    enabled: true
                },
            enableMouseTracking: false
        }
    },
    series: [{
        name: 'XY',
        data: [[3.9, 4.2], [5.7, 8.5], [8.9, 15.2], [17.0, 26.6], [34.2, 50.3], [46.6, 74.8]]
    }]
    });
    chart = $('#THChartDiv').highcharts();


    第二种:动态数据

     动态数据有几种办法,

      1:单独设置Ajax方法或者函数对data设值

          (1)首先对chart设置空数据

          series: [{
                        name: '水位',
                        data: []
                    }]

       (2)再单独调用Ajax方法对chart重新赋值

           $.ajax({
                    url: urlData,
                    success: function (data) {

                        //把后台返回的json字符串转换为json对象
                        var jsonData = eval("(" + data + ")");
                        //定义一个数组
                        var sdata = [];

                        //获取图形实例
                        var series = chart.series[0];
                        //迭代,把异步获取的数据放到数组中
                        var i = 0;
                        $.each(jsonData, function (i, d) {

                            //此处必须强制数据类型转换,否则有可能不能正确绘制图形
                            sdata.push([parseFloat(d.z), parseFloat(d.q)]);
                        });
                        //设置数据,重新绘制图形
                        series.setData(sdata);
                    }
                });

      2:chart在load事件中对data设值

  • 相关阅读:
    ERP SYSTEM 开发指南(一)简单模块开发
    机器学习--决策树
    机器学习---线性模型
    机器学习
    《IDA Pro 权威指南》学习
    内核漏洞利用技术
    word2vec、seq2seq
    Ring0级的探索
    ActiveX 控件的漏洞挖掘
    FTP的漏洞挖掘
  • 原文地址:https://www.cnblogs.com/coolsundy/p/4207233.html
Copyright © 2020-2023  润新知