fix: Tooltip скрывается при mouseout/mouseleave - handlers после создания чарта
- Убраны IIFE и DOMContentLoaded обёртки - Обработчики вешаются сразу после создания Chart - Уникальные имена переменных canvas для каждой метрики
This commit is contained in:
parent
e9cc71ddfe
commit
e955eb84b1
|
|
@ -606,11 +606,9 @@ const chart{{ metricName|replace({'-': '_', '.': '_'}) }} = new Chart(ctx{{ metr
|
||||||
});
|
});
|
||||||
|
|
||||||
// Скрывать tooltip при уходе курсора с canvas в любую сторону
|
// Скрывать tooltip при уходе курсора с canvas в любую сторону
|
||||||
(function() {
|
var canvas{{ metricName|replace({'-': '_', '.': '_'}) }} = document.getElementById('chart-{{ metricName }}');
|
||||||
var canvas = document.getElementById('chart-{{ metricName }}');
|
if (canvas{{ metricName|replace({'-': '_', '.': '_'}) }}) {
|
||||||
if (!canvas) return;
|
canvas{{ metricName|replace({'-': '_', '.': '_'}) }}.addEventListener('mouseout', function() {
|
||||||
|
|
||||||
canvas.addEventListener('mouseout', function() {
|
|
||||||
var tooltipEl = document.getElementById('chartjs-tooltip-{{ server.id }}-{{ metricName }}');
|
var tooltipEl = document.getElementById('chartjs-tooltip-{{ server.id }}-{{ metricName }}');
|
||||||
if (tooltipEl) {
|
if (tooltipEl) {
|
||||||
tooltipEl.style.visibility = 'hidden';
|
tooltipEl.style.visibility = 'hidden';
|
||||||
|
|
@ -618,14 +616,14 @@ const chart{{ metricName|replace({'-': '_', '.': '_'}) }} = new Chart(ctx{{ metr
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
canvas.addEventListener('mouseleave', function() {
|
canvas{{ metricName|replace({'-': '_', '.': '_'}) }}.addEventListener('mouseleave', function() {
|
||||||
var tooltipEl = document.getElementById('chartjs-tooltip-{{ server.id }}-{{ metricName }}');
|
var tooltipEl = document.getElementById('chartjs-tooltip-{{ server.id }}-{{ metricName }}');
|
||||||
if (tooltipEl) {
|
if (tooltipEl) {
|
||||||
tooltipEl.style.visibility = 'hidden';
|
tooltipEl.style.visibility = 'hidden';
|
||||||
tooltipEl.style.opacity = '0';
|
tooltipEl.style.opacity = '0';
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
})();
|
}
|
||||||
|
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue