javascript - Reuse function to load data into Highchart

Question

I have a Highchart object and a function to load the data:

graficaPropuestas = new Highcharts.Chart({
        chart: {
            height: 300,
            renderTo: "graficaPropuestas",
            plotBackgroundColor: null,
            plotBorderWidth: null,
            plotShadow: false,
            events: {
                load: recogerDatosInforme('propuesta', $(this))
            }
        }
 })

And the function to load the data:

function recogerDatosInforme(tipo, gr) {
        $.ajax({
            url: '/Licencia/recogerDatosUsuariosSistema?tipo' + tipo,
            datatype: "json",
            success: function(data) {
                gr.series[0].setData(data);
            },
            cache: false
        });
    }

I want to pass the graficaPropuestas object to the function so I can reuse the same function to load more graphs, however I cant get this to work. If I put in the function directly the graficaPropuestas object on the success: method it work well.

Any help would be appreciated.

Answer 1

我通过这种方式解决了它：

获取数据的函数：

function recogerDatosInforme(tipo, gr) {
        $.ajax({
            url: '/Informes/recogerDatosInforme?tipo=' + tipo,
            datatype: "json",
            success: function(data) {
                gr.series[0].setData(data);
            },
            cache: false
        });
    }

然后我在init没有events方法的情况下创建图表：

graficaPropuestas = new Highcharts.Chart({
    chart: {
        height: 300,
        renderTo: "graficaPropuestas",
        plotBackgroundColor: null,
        plotBorderWidth: null,
        plotShadow: false
    }

})

我用图形对象作为参数调用函数：

recogerDatosInforme('propuesta', graficaPropuestas)

所以现在我可以制作更多的图表对象并使用相同的函数来获取数据。

Answer 2

如果您只有一个graficaPropuestas更好和更高效的实例，则使用该解决方案：

var graficaPropuestas = new Highcharts.Chart( ... 

function recogerDatosInforme(tipo) {
        $.ajax({
            url: '/Licencia/recogerDatosUsuariosSistema?tipo' + tipo,
            datatype: "json",
            success: function(data) {
                graficaPropuestas.series[0].setData(data);
            },
            cache: false
        });
    }