空白 - ChartJSの折れ線グラフのポイントストローク

chartJS折れ線グラフでこのようなポイントを達成するにはどうすればよいですか？ここで空白 - ChartJSの折れ線グラフのポイントストローク

2017-11-14 Tudor-Radu Barbu

後にあなたがポイントのスタイルを取得する例です：折れ線グラフのためのポイント・オプションのドキュメントは、以下のコードhereのhere

A codePenを見つけることができます

HTML：

の

<html> 
    <body> 
    <div class="myChartDiv"> 
     <canvas id="myChart" width="600" height="400"></canvas> 
    </div> 
    </body> 
</html>

JS：

new Chart(document.getElementById("myChart"), { 
    type: "line", 
    data: { 
    labels: ["January", "February", "March", "April", "May", "June"], 
    datasets: [ 
     { 
     label: "My First Dataset", 
     data: [20, 25, 22, 19, 31, 40], 
     fill: true, 
     borderColor: "rgb(75, 192, 192)", 
     backgroundColor: "rgba(0,0,0,0.1)", 
     borderWidth: 2, 
     lineTension: 0, 
     /* point options */ 
     pointBorderColor: "blue", // blue point border 
     pointBackgroundColor: "white", // wite point fill 
     pointBorderWidth: 1, // point border width 
     } 
    ] 
    }, 
    options: { 
    legend: { 
     labels: { 
     usePointStyle: true, // show legend as point instead of box 
     fontSize: 10 // legend point size is based on fontsize 
     } 
    } 
    } 
});

出典

2017-11-14 17:10:46

空白 - ChartJSの折れ線グラフのポイントストローク

答えて

関連する問題