space chart.js 中的数据点前后

Question

是否可以在每个数据点前后添加一个 space？就像这张图片：

Answer 1

存在一系列dataset properties that can be used to style the points。您可以使用以下内容来实现您的目标。

点背景颜色
点半径
点边框颜色
点边框宽度

请查看以下代码片段。

new Chart(document.getElementById("myChart"), {
    type: "line",
    data: {
        labels: ["January", "February", "March", "April", "May", "June", "July"],
        datasets: [{
            label: "My First Dataset",
            data: [65, 59, 80, 81, 56, 55, 40],
            fill: false,
            borderColor: "rgb(75, 192, 192)",
            lineTension: 0.1,          
            pointBackgroundColor: "rgb(75, 192, 192)",
            pointRadius: 8,
            pointBorderColor: 'white',
            pointBorderWidth: 8
        }]
    },
    options: {}
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.min.js"></script>
<canvas id="myChart" height="80"></canvas>

If you want the points to also look the same when the mouse pointer hovers over them, you'll have to define the following properties with identical values.

pointHoverBackgroundColor

pointHoverRadius

pointHoverBorderColor

pointHoverBorderWidth

space chart.js 中的数据点前后

space before and after data points in chart.js

chart.js

ng2-charts