chartjs event control - pai-plznw4me/django-initializer GitHub Wiki

Chartjs λ‚΄ chart μ—μ„œ event λ°œμƒμ‹œ tooltip μ œμ–΄

Chartjs click event 등둝 ν•˜λŠ” 법

μ•„λž˜ κΈ°λŠ₯ μ„€λͺ… : point 을 click ν•˜λ©΄ graphClickEvent function 이 μž‘λ™ν•œλ‹€.

1.

const myChart = new Chart($(elementId), {
    type: 'line',
    data: data,
    options: {
        onClick : graphClickEvent
    }
});

2.

function graphClickEvent(event){

    // λ§ˆμš°μŠ€κ°€ point κ·Όμ²˜μ— μžˆμ„ λ•Œ, point 객체λ₯Ό λ°˜ν™˜ν•©λ‹ˆλ‹€. 
    var activePoints = myChart.getElementsAtEventForMode(event, 'nearest', { intersect: true }, true);

    // 데이터가 μ€‘λ³΅λ˜μ–΄ μžˆμ„λ•Œ 첫번째 데이터λ₯Ό κ°€μ Έμ˜΅λ‹ˆλ‹€. 
    var firstPoint = activePoints[0];

};

Example)

ν΄λ¦­μ‹œ console 에 객체 정보 λ„μš°κΈ°