在画布中显示输入值中的单个点-chart.js

时间:2018-10-19 16:01:44

标签: javascript chart.js

是否可以从#point输入中获取输入值并将其显示在画布上?例如,如果输入值为1,则它将在(1, 4)位置上放置一个点,或者,如果输入值为3,则将在{{1 }}位置?

我的以下代码不显示输入值,还显示所有其他值为(3, 4)的点。

0
var ctx = document.getElementById("myChart").getContext('2d');
var myChart = new Chart(ctx, {
    type: 'bar',
    data: {
        labels: ["0", "1", "2", "3", "4", "5"],
        datasets: [{
            label: 'Line',
            data: [3.2, 4.2, 5.1, 5.8, 6.4, 6.9],
            borderColor: [
                'rgba(255,99,132,1)'
            ],
            borderWidth: 1.5,
            fill: false,
            type: 'line',
        }, {
            label: 'Point',
            fill: false,
            borderColor: 'rgba(155,102,102,0)',
            borderWidth: 1.5,
            data: [0, 0, 6, 0, 0],
            pointRadius: 10,
            type: 'line',
            pointBackgroundColor: "green",
        }]
    },
    options: {
        scales: {
            yAxes: [{
                ticks: {
                    beginAtZero: true
                }
            }]
        }
    },
});

$(document).ready(function() {
    $(".show").click(function() {
        var point = $('#point').val();
        myChart.data.datasets[1].data['' + point + ''] = 4;
        myChart.update();

    });
});

0 个答案:

没有答案