askakao 2017-08-23 06:36 采纳率: 0%
浏览 998

HighChart 动态产生series数据组

请问在HighChart中 要如何动态产生series??
因为不知道会有几条数据组产生,所以必须用动态方式产生
代码中会先执行
createChart();
refreshChart(xx,xx,xx,xx,....);

谢谢

function refreshChart(chart, area, entity, eqpid, sday, eday) {
var series = new Array();
$.ajax({
type: "POST",
url: "Uptime_ChartByID.aspx/refreshChartID",
data: "{'area':'" + area + "'}",
dataType: "json",
contentType: "application/json; charset=utf-8",

            success: function (data) {
                if (data.d.length > 0) {
                    var tmpDay = data.d[0].toString().replace('[', '').replace(']', '').replace(/(['"])/g, "").split(",");

                    var title = {
                        text: 'Trend Chart'
                    }
                    var subtitle = {
                        text: $('#txtFrom').val() + ' ~ ' + $('#txtTo').val()
                    };

                    chart.setTitle(title, subtitle);      //subtitle
                    chart.xAxis[0].setCategories(tmpDay);  //X轴资料

                    for (var i = 1; i < data.d.length; i++) {
                        var tmpData = data.d[i].toString().replace('[', '').replace(']', '').replace(/(['"])/g, "").split(",");
                        series.push({ "name": i, "data": tmpData });
                    }
                                            chart.series = series;     //这是我动态产生的series,但要怎麽回传??
                    chart.redraw();
                }
                $('#loading').hide();
            },
            error: function (xhr, ajaxOptions, thrownError) {
                alert(xhr.status);
                alert(thrownError);
            }
        });

}

function createChart() {
var chart1 = new Highcharts.Chart({
chart: {
renderTo: 'chart1',
zoomType: 'xy'
},
title: {
text: ''
},
subtitle: {
text: '' //subtitile
},

            xAxis: {
                tickmarkPlacement: 'on',
                title: {
                    enabled: true
                },
                labels: {
                    rotation: -45,
                    style: {
                        color: 'black', fontSize: '12px', fontFamily: 'Arial Black'
                    }
                },
                categories: [],
            },
            yAxis: [{ //设置Y轴-第1个(增幅) 
                labels: {
                    formatter: function () { //格式化标签名称 
                        return this.value;
                    },
                    style: {
                        color: '#4572A7', //设置标签颜色 
                        fontSize: '12px', fontFamily: 'Arial Black'
                    },
                    enabled: true  //隐藏Y轴刻度显示
                },
                title: {
                    text: '%', style: {
                        fontSize: '12px', fontFamily: 'Arial Black'
                    },
                }, //Y轴标题设为空 

                tickPositions: [0, 10, 20, 30, 40, 50, 60, 70, 80, 90, 100],  //Y轴刻度限定
            }, ],
            tooltip: { //鼠标滑向数据区显示的提示框 
                crosshairs: true,
                shared: true,
            },
            legend: { //设置图例 
                layout: 'horizontal', //水平排列图例 
                align: 'center',
                shadow: true,  //设置阴影 
            },

                                series: [],     //这边要如何接收series????
            credits: {
                enabled: false
            }
        });
    }
  • 写回答

1条回答 默认 最新

  • devmiao 2017-08-23 16:38
    关注
    评论

报告相同问题?

悬赏问题

  • ¥15 #MATLAB仿真#车辆换道路径规划
  • ¥15 java 操作 elasticsearch 8.1 实现 索引的重建
  • ¥15 数据可视化Python
  • ¥15 要给毕业设计添加扫码登录的功能!!有偿
  • ¥15 kafka 分区副本增加会导致消息丢失或者不可用吗?
  • ¥15 微信公众号自制会员卡没有收款渠道啊
  • ¥100 Jenkins自动化部署—悬赏100元
  • ¥15 关于#python#的问题:求帮写python代码
  • ¥20 MATLAB画图图形出现上下震荡的线条
  • ¥15 关于#windows#的问题:怎么用WIN 11系统的电脑 克隆WIN NT3.51-4.0系统的硬盘