laravelで開発をしております。
ajaxでとってきた値を、Chart.jsに渡し、グラフを再描画しようとしていますが、真っ白になり何も表示されません。
まず、画面読み込み時では、
$(document).ready(function(){
var doughnutData = [{!! $data['graph2'] !!}];
var myDoughnut = new Chart(document.getElementById("doughnut").getContext("2d")).Doughnut(doughnutData);
});
として、ドーナツグラフが表示されます。
そして、okBtnをクリックすると、選択データが指定urlにpostされ、データをとってきます。
console.logに表示すると、確かにデータは取れています。
ですが、画面にはドーナツグラフが表示されません。
$('.okBtn').on('click', function(){
var url = $('#actionUrl').text();
var column = $('[name=column]:checked').val();
var get_data="";
$.ajax({
type: "POST",
url: url,
data: {"column":column},
success: function(data, dataType)
{
get_data = data;
console.log(get_data);
var doughnutData = [get_data];
var myDoughnut = new Chart(document.getElementById("doughnut").getContext("2d")).Doughnut(doughnutData);
}
});
});
試しに、
var doughnutData = [get_data];
上記のget_data部分をconsole.logで表示された値に変更すると、グラフは表示されます。
ただ、グラフの上にマウスポインタが乗ると、画面読み込み時のグラフが一瞬表示されたりするので、挙動はおかしいのですが。。。
そもそもグラフを描画する部分が二つあることがおかしいのでしょうか?
エラーも出ないので、途方に暮れています。
有識者の方、どうぞよろしくお願い致します。
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。