当动态创建图表时，getElementsAtEvent总是给出最后一个图表值

Question

我正在动态创建图表。除了click事件总是给出最后一个图表值之外，一切正常。因为图表变量在for循环中得到覆盖并且仅存储了最后一个图表上下文。 有人可以建议如何存储点击事件的图表参考吗？

for(i=0;i<chart.length;i++)
    {
        $("#chartCon").append("<canvas id='chart_"+i+"'  arrayType="+arrayType[i]+" filterKey="+filterKey[i]+"></canvas>")


        var ctx = document.getElementById('chart_'+i+'').getContext('2d');
        **var chart** = new Chart(ctx, chart[i]);

        document.getElementById("chart_"+i+"").onclick = function(evt)
        {   

            alert($(this).attr("id"));
            var activePoints = **chart.**getElementsAtEvent(evt);//How to stored chart reference for click event
            if(activePoints.length > 0)
                {
                    var clickedElementindex = activePoints[0]["_index"];
                    var label = chart.data.labels[clickedElementindex];
                    var value = chart.data.datasets[0].data[clickedElementindex];
                    alert("label"+label);
                }
        }
}

由于