点击chart.js获取值

Question

早上好，

使用下面的代码，我想知道如何在我的警报中检索日期值（例如 202301，.......）：alert(label + ": " + value);

现在我的警报给出了结果，例如，JANUARY：153。 我想要一月：153 202301 甚至只是 202301

<div class="row" id="sx"
        <?php
        $month = array(202301, 202302, 202303, 202304, 202305, 202306); 
        $nmonth = array('JANUARY', 'FEBRUARY', 'MARCH', 'APRIL', 'MAY', 'JUNE' );
        ?>
            
        <div class="chartBox1">
            <canvas id="myChart" ></canvas>
        </div>
        
        <?php
        $values = array(153, 152, 170, 40, 80, 112);
        ?>
                
                <script>
                var ctx = document.getElementById("myChart").getContext('2d');
                var myChart = new Chart(ctx, {
                    type: 'bar',
                    data: {
                        labels: <?php echo json_encode($nmonth); ?>,
                        datasets: [{
                                label: '# Months Values',
                                data: <?php echo json_encode($values); ?>,
                                backgroundColor: [
                                    'rgba(255, 99, 132, 0.2)',
                                    'rgba(54, 162, 235, 0.2)',
                                    'rgba(255, 206, 86, 0.2)',
                                    'rgba(75, 192, 192, 0.2)',
                                    'rgba(153, 102, 255, 0.2)',
                                    'rgba(255, 159, 64, 0.2)'
                                ],
                                borderColor: [
                                    'rgba(255,99,132,1)',
                                    'rgba(54, 162, 235, 1)',
                                    'rgba(255, 206, 86, 1)',
                                    'rgba(75, 192, 192, 1)',
                                    'rgba(153, 102, 255, 1)',
                                    'rgba(255, 159, 64, 1)'
                                ],
                                borderWidth: 1
                            }
                        ]
                    },
                    options: {
                        scales: {
                            yAxes: [{
                                    ticks: {
                                        beginAtZero:true
                                    }
                                }]
                        }
                    },
                    
                    onClick:function(e) {
                    /*var activePoints = myChart.getElementsAtEvent(e);
                    var selectedIndex = activePoints[0]._index; */
                    /* alert(this.data.datasets[0].data[selectedIndex]);
                    console.log(this.data.datasets[0].data[selectedIndex]);
                    */
                    }
                });

                    /* https://github.com/chartjs/Chart.js/issues/2292 */
                document.getElementById("myChart").onclick = function (evt) {
                    var activePoints = myChart.getElementsAtEventForMode(evt, 'point', myChart.options);
                    var firstPoint = activePoints[0];
                    var label = myChart.data.labels[firstPoint._index];
                    var value = myChart.data.datasets[firstPoint._datasetIndex].data[firstPoint._index];
                    alert(label + ": " + value);
                    getNewAlert(value);
                };
                </script>
    </div>

你有办法解决我的问题吗

Answer 1

您将从

values

数组中获取当前值。

1-首先获取对应的key/index

$month = array(202301, 202302, 202303, 202304, 202305, 202306); 
$values = array(153, 152, 170, 40, 80, 112);

$valueIndex =  array_search(153, $values); 
echo $valueIndex; // 0

2 - 获取您的

valueIndex

对应的月份

echo $month[$valueIndex]; // 202301