2017-09-01 163 views
0

我開發的餅圖如下chartjs V2.6.0。當我使用同一餅圖中的新數據進行搜索時,它可以正常工作,並在懸停時顯示以前的數據。我嘗試了$('#canvas').remove();方法,但它不起作用。如何刪除以前的餅圖並在js中添加新的餅圖

var color = []; 
var label = []; 
var datas = []; 
var odata = 1; 

for (i = 0; i < result.length; i++) { 
    label.push(result[i].label); 
    color.push(result[i].color); 
    datas.push(result[i].value1); 
} 

var config = { 
    type: 'pie', 
    data: { 
    labels: label, 
    datasets: [{ 
     backgroundColor: color, 
     data: datas 
    }] 
    }, 
    options: { 
    responsive: true, 
    legend: { 
     display: false 
    }, 
    tooltips: { 
     enabled: true, 
    }, 
    onClick: graphClickEvent 
    } 
}; 

var ctx = document.getElementById("state-area").getContext("2d"); 
new Chart(ctx, config); 

function graphClickEvent(event, array) { 
    console.log(event); 
    console.log(array); 
} 

回答

0

我曾經只是刪除以前的帆布,並添加新的畫布。它工作正常。

$('#state-area').remove(); 
 
$('#graph-container').append('<canvas id="state-area" height="300" height="300" style="z-index:999999;"><canvas>');