2012-03-12 12 views
5

Próbuję utworzyć narzędzie do tworzenia wykresów. Mam dane wejściowe użytkownika dla tytułu i lokalizacji legendy. Chcę, aby użytkownik wpisał tytuł i kiedy kliknięcie (rozmycie) wykresu zostanie zaktualizowany o to, co wpisał.Render Highcharts po zaktualizowanych etykietach użytkownika

Problem polega na tym, że wykres renderuje się po raz pierwszy, ale nigdy nie można uzyskać znaku ponownie. Oto krótkie podsumowanie kodu.

$('#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(); 
} 
}; 

Wykres renderuje się po raz pierwszy, a następnie jest po raz drugi pusty biały obszar. Jakieś pomysły? chartData jest zmienną zawierającą wszystkie opcje, które są renderowane poprawnie.

o to JSFiddle który pokazuje WYDANIE http://jsfiddle.net/zVjrb/3/

+0

Aby użyć tych samych danych wykonaj następujące czynności. Zmodyfikuj sekcję chart.options. Następnie przekazuj to do highcharts. var chart = Highcharts.chart (chart.options) – Sean

Odpowiedz

10

zorientowali się problem. Szczegółowe tutaj: http://highslide.com/forum/viewtopic.php?f=12&t=15255

Zasadniczo funkcja Highcharts.charts usuwa dane serii z oryginalnego obiektu opcji.

To jest mój kod roboczych:

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(); 
    } 
}; 
+2

Miałem podobne problemy, gdy ładowałem highchart do okna dialogowego jquery-ui - skończyło się na rozwiązaniu go przez wyczyszczenie okna dialogowego specyficznie wywołującego $ (". highcharts-container") .removeClass(). Mam nadzieję, że to pomoże komuś innemu i zaoszczędzić im trochę, a więc zmarnowało się na mnie. – Ross

Powiązane problemy