0
私はChart.jsを使ってグラフを作っています。Chart.jsの古いデータと古いグラフを取り除くにはどうすればいいですか?
グラフを使用すると問題が発生します。グラフ上にカーソルを置くと、古い値の古いグラフは消えません。ドキュメントによると、古いデータを取り除くために.destroy()または.clear()を使用しようとしましたが、動作しません。ここで
は、以下のコードです:
<!DOCTYPE html>
<html>
<head>
\t <title>hp mp</title>
\t <meta charset="utf-8">
\t <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.1.3/Chart.min.js"></script>
</head>
<body onload="hpmpGraph()">
\t <script>
\t \t function hpmpGraph() {
\t \t \t var hp = document.hpmpForm.HP.value,
\t \t \t \t mp = document.hpmpForm.MP.value,
\t \t \t \t ctx = document.getElementById('hpmpratio').getContext('2d');
\t \t \t \t
\t \t \t var \t data = {
\t \t \t \t labels: ["HP","MP"],
\t \t \t \t datasets:
\t \t \t \t \t [{
\t \t \t \t \t \t data: [hp,mp],
\t \t \t \t \t \t backgroundColor: ["#EF0000","#0000EF"],
\t \t \t \t \t \t hoverBackgroundColor: ["#FF0000","#0000FF"]
\t \t \t \t \t }]
\t \t \t };
\t \t \t var options = {};
\t \t \t var myPieChart = new Chart(ctx, {
\t \t \t \t type: 'pie',
\t \t \t \t data: data,
\t \t \t \t options: options
\t \t \t });
\t \t }
\t </script>
\t <h1>HP & MP</h1>
\t <form name=hpmpForm method=post>
\t \t HP : <input type="text" name="HP" value="100"><br>
\t \t MP : <input type="text" name="MP" value="100"><br>
\t \t <button type="button" onClick="hpmpGraph();">Click</button>
\t \t <h2>Pie graph</h2>
\t \t <canvas id="hpmpratio" height="50"></canvas>
\t </form>
</body>
</html>
HPとMPが100の試みで、両方のセットは、HP 1000を設定しています。次に、カーソルをグラフに置き、円の中を移動します。いつか、古いグラフが表示されます。
をありがとうございました、私はチャートを作り直すべきではないことを知らなかった –