用户更新标签后呈现Highcharts

Question

我正在尝试创建图表生成器。我有一个用户输入标题和图例的位置。我希望用户输入标题，以及何时点击（模糊）图表以更新他们输入的内容。

问题是图表呈现第一次，但我永远不能再获取字符渲染。以下是代码的简要概述。

$('#legendlocation-select').blur(function updateChartLegend(){ 
console.log($('#legendlocation-select').val()); 
if($('#legendlocation-select').val()==='none'){ 
    chartData.legend.enabled = 'false'; 
}else{ 
    chartData.legend.enabled = 'true'; 
    chartData.legend.align = $('#legendlocation-select').val(); 
} 
renderChart(); 
}); 
function renderChart(){ 
if(chart == undefined){ 
    console.log("First Draw"); 
    chart = new Highcharts.Chart(chartData); 
}else{ 
    console.log("Redraw"); 
    chart.destroy(); 
    chart = new Highcharts.Chart(chartData); 
    chart.redraw(); 
} 
}; 

图表使得第一时间，然后仅仅是一个空白白色区域的第二次。有任何想法吗？ chartData是一个变量，其中包含所有可正确呈现的选项。

这里是一个的jsfiddle显示想通了问题的问题http://jsfiddle.net/zVjrb/3/

Answer 1

。详细在这里：http://highslide.com/forum/viewtopic.php?f=12&t=15255

基本上Highcharts.charts函数从原始选项对象清除系列数据。

这是我的工作代码：

var chart; 
var chartData = { /* you chart data goes here */ }; 
$('#legendlocation-select').blur(function updateChartLegend(){ 
    console.log($('#legendlocation-select').val()); 
    if($('#legendlocation-select').val()==='none'){ 
    chart.options.legend.enabled = false; 
    }else{ 
    chart.options.legend.enabled = true; 
    chart.options.legend.align = $('#legendlocation-select').val(); 
    } 
    renderChart(); 
}); 

function renderChart(){ 
    //console.log(chartData); 
    if(chart == undefined){ 
    console.log("First Draw"); 
    chart = new Highcharts.Chart(chartData); 
    }else{ 
    console.log("Redraw"); 
    chart.options.chart.animation = false; 
    chart = new Highcharts.Chart(chart.options); 
    chart.render(); 
    } 
};