javascript - jqPlot甜甜圈变化数据

Question

我正在使用 jqPlot 插件来绘制一些图。当我决定更改绘图数据时遇到问题，但我找不到可以执行此操作的函数。任何人都知道什么功能可以帮助我？

这是我的代码：

var musica = [
    ['IVA', 16],
    ['Tienda', 40.2],
    ['Discográfica', 22.4],
    ['Distribuidor', 4],
    ['La fabricación', 4],
    ['Derechos del autor', 4],
    ['Royalty para el artista', 9.4]
];
var plot1 = $.jqplot ('grafico_musica', [musica],
    {
        title: "Música",
        seriesDefaults: {
            renderer: $.jqplot.PieRenderer,
            rendererOptions: {
                dataLabelFormatString:'%.1f%',
                showDataLabels: true
            }
        },
        legend: {
            show:true,
            location: 'e'
        },
        highlighter: {
            show: true,
            formatString:'%s',
            tooltipLocation:'sw',
            useAxesFormatters: false
        }
    }
);

我试图通过这种方式更改数据属性，但它不起作用

plot1._plotData = peliculas;// peliculas is an array previously defined

使用此功能解决的问题：

plot1.replot({data: [peliculas]});

Answer 1

这可能会有所帮助：

plot1.destroy();
plot1 = $.jqplot ('grafico_musica', [peliculas],
    {
        title: "Música",
        seriesDefaults: {
            renderer: $.jqplot.PieRenderer,
            rendererOptions: {
                dataLabelFormatString:'%.1f%',
                showDataLabels: true
            }
        },
        legend: {
            show:true,
            location: 'e'
        },
        highlighter: {
            show: true,
            formatString:'%s',
            tooltipLocation:'sw',
            useAxesFormatters: false
        }
    }
);

将前面的代码添加到函数中，并在需要时调用。

希望有帮助

Answer 2

解决方案是破坏并重新创建情节：

function createChart(data1) {
    if (plot1) { plot1.destroy(); }
          plot1 = jQuery.jqplot ('chart', [data1], 
        {
            title: "Música",
            seriesDefaults: {
                renderer: $.jqplot.PieRenderer,
                rendererOptions: {
                    dataLabelFormatString:'%.1f%',
                    showDataLabels: true
                }
            },
            legend: {
                show:true,
                location: 'e'
            },
            highlighter: {
                show: true,
                formatString:'%s',
                tooltipLocation:'sw',
                useAxesFormatters: false
            }
        });
}

这是一个工作示例http://jsfiddle.net/U2xef/