Chart JSを使用した空のPNG画像。 toBase64Image（）function

Question

Chart.JSグラフ作成ライブラリを使用して作成したグラフのコピーを保存しようとしています。 .toBase64Image（）関数を使用して.pngイメージを表示または保存すると、空のイメージが表示されます。私はimgタグで表示し、PHPで画像を保存しようとしました。 save64Imgは画像を表示/保存する機能です。誰もこの機能を使って運があったのですか？

lineOptions = { 
     scaleShowGridLines : true, 
     scaleGridLineColor : "rgba(0,0,0,.05)", 
     scaleGridLineWidth : 1, 
     bezierCurve : false, 
     pointDot : true, 
     pointDotRadius : 4, 
     pointDotStrokeWidth : 1, 
     pointHitDetectionRadius : 20, 
     datasetStroke : true, 
     datasetStrokeWidth : 1, 
     datasetFill : true, 
     responsive: true,  
     scaleOverride : true, 
     scaleSteps : 5, 
     scaleStepWidth : 20, 
     scaleStartValue : 0 

    } 

    lineChart = { 
      labels : label, 
      datasets : [ 
       { 
        label: "stat1", 
        fillColor : "rgba(128,0,0,0.2)", 
        strokeColor : "rgba(128,0,0,1)", 
        pointColor : "rgba(128,0,0,1)", 
        pointStrokeColor : "#fff", 
        pointHighlightFill : "#fff", 
        pointHighlightStroke : "rgba(128,0,0,1)", 
        data : stat1 
       }, 
       { 
        label: "stat2", 
        fillColor : "rgba(151,187,205,0.2)", 
        strokeColor : "rgba(151,187,205,1)", 
        pointColor : "rgba(151,187,205,1)", 
        pointStrokeColor : "#fff", 
        pointHighlightFill : "#fff", 
        pointHighlightStroke : "rgba(151,187,205,1)", 
        data : stat2 
       } 
      ] 

    }; 

var myChart = new Chart(ctx).Line(lineChart, lineOptions); 

save64Img(myChart.toBase64Image()); 

---------- 

<?php 
$data = base64_decode(preg_replace('#^data:image/\w+;base64,#i', '', $img)); 

file_put_contents('/tmp/image.png', $data); 

?> 

Answer 1

追加のコールバックでsave64Img(myChart.toBase64Image())に電話する必要があります。 あなたは私はあなたが質問をしてきたが、Chart.jsでアニメーションオプション内onCompleteメソッドを使用する必要がV2ので、それがしばらくしてだということを知っているオプション

lineOptions = { 
    onAnimationComplete: function() { 
     save64Img(myChart.toBase64Image()); 
    } 
} 

Answer 2

にこのコールバックを追加することができます。

animation: { 
    duration: 1500, 
    onComplete: function (animation) { 
     this.toBase64Image(); 
}