javascript highcharts 使用 addSeries 动态添加系列

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/14074435/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 20:38:47  来源:igfitidea点击:

highcharts dynamically adding series with addSeries

javascriptdynamichighcharts

提问by willJk

I'm working on creating a dynamically created chart that will add a series if there isn't one and if there is one add a point. I'm getting an Uncaught TypeError: Cannot call method 'addSeries' of undefined. I've looked around and I can't find why it says that method is undefined.

我正在创建一个动态创建的图表,如果没有一个系列,它将添加一个系列,如果有一个添加一个点。我收到未捕获的类型错误:无法调用未定义的方法“addSeries”。我环顾四周,找不到为什么它说该方法未定义。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
<script type="text/javascript" src="highcharts.js"></script>
$(document).ready(function () {

    var chart1 = new Highcharts.Chart({
        chart: {
            renderTo: 'container',
            type: 'column',
            events: {
                load: requestData
            }
        },
        title: {
            text: 'Survey Chart'

        },
        xAxis: {
            categories: [],
            title: {
                text: 'Question Number'
            }

        },
        yAxis: {
            title: {
                text: 'Total Answered'
            }
        },
        legend: {
            layout: 'vertical',
            align: 'left',
            verticalAlign: 'top',
            x: 100,
            y: 70,
            floating: true
        },
        series: []
    });

with the document ready function taking up the entire script i have the following functions

随着文档就绪功能占据整个脚本,我有以下功能

    function requestData() {
    ajaxCall(chartCreate, createSeries, "services/Survey.svc/DoWork", "{}");
    chart1.redraw();
};


function chartCreate(point) {
    var temp;
    temp = $.parseJSON(point.d);
    $.each(temp, function (key, p) {
        var seriesObj;
        seriesObj = seriesExists(p.mcAnswer);
        if (seriesObj.status == false) {
            chart1.addSeries({name: '' + p.mcAnswer + '', data: [] });
            chart1.series[seriesObj.count].addPoint(p.total, false);
        } else {
            chart1.series[seriesObj.count].addPoint(p.total, false);
        }
    });
};

//loops through all the series to see if the series exists.
//if true returns index and true if not just returns false
function seriesExists(name) {
    var ct = 0;
    //var len = chart1.series.length;
    var len = 0;
    if (len > 0) {
        $.each(chart1.series, function (count, curSeries) {
            if (curSeries.name == name) {
                return { 'count': count, 'status': true };
            }
            ct = count;
        });
    }
    return { 'count': ct, 'status': false };
};    function createSeries() {
    alert("error");
};

//$.ajaxCall({successFun: function, errorFun: function, source: "", data: {}});
function ajaxCall(myFunSuccess, myFunError, url, data) {
    //chart1 = chartTemp;
    $.ajax({
        type: "POST",
        async: false,
        url: url,
        data: data,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: myFunSuccess,
        error: myFunError
    });
    //return chart1;
};

I'm able to use the ajax function call fine it's when I get to my chartCreate where I run into the problem.

我可以很好地使用 ajax 函数调用,这是当我到达我的 chartCreate 时遇到问题的地方。

采纳答案by Ricardo Alvaro Lohmann

The problem is that you're trying to add the serie before chart1get your chart reference. That's why chart1doens't have addSeriesmethod.

问题是您试图在chart1获得图表参考之前添加系列。这就是为什么chart1没有addSeries方法。

You can see this issue here.

您可以在此处查看此问题。

To fix it you can set manually the chart reference to chart1before call requestData.
Like the following.

要修复它,您可以chart1在调用之前手动设置图表引用requestData
像下面这样。

load: function() {
    chart1 = this; // `this` is the reference to the chart
    requestData();
}