sales analyzer tooltips
This commit is contained in:
parent
aff5ec85fa
commit
853520d3b0
|
@ -394,20 +394,7 @@
|
|||
.transition().duration(0)
|
||||
.call(salesChart);
|
||||
|
||||
// Add mouseleave, and mousemove event listeners to hide tooltip
|
||||
d3.select('.sales-chart').on('mouseleave', function() {
|
||||
d3.select('.nvtooltip').remove();
|
||||
});
|
||||
|
||||
d3.select('body').on('mousemove', function() {
|
||||
var chartBounds = d3.select('.sales-chart')[0][0].getBoundingClientRect();
|
||||
var mouseX = d3.event.clientX;
|
||||
var mouseY = d3.event.clientY;
|
||||
|
||||
if (mouseX < chartBounds.left || mouseX > chartBounds.right || mouseY < chartBounds.top || mouseY > chartBounds.bottom) {
|
||||
d3.select('.nvtooltip').remove();
|
||||
}
|
||||
});
|
||||
|
||||
nv.utils.windowResize(salesChart.update);
|
||||
return salesChart;
|
||||
});
|
||||
|
@ -442,20 +429,7 @@
|
|||
.transition().duration(0)
|
||||
.call(cumulativeProfitChart);
|
||||
|
||||
// Add mouseleave, and mousemove event listeners to hide tooltip
|
||||
d3.select('.cumulative-profit-chart').on('mouseleave', function() {
|
||||
d3.select('.nvtooltip').remove();
|
||||
});
|
||||
|
||||
d3.select('body').on('mousemove', function() {
|
||||
var chartBounds = d3.select('.cumulative-profit-chart')[0][0].getBoundingClientRect();
|
||||
var mouseX = d3.event.clientX;
|
||||
var mouseY = d3.event.clientY;
|
||||
|
||||
if (mouseX < chartBounds.left || mouseX > chartBounds.right || mouseY < chartBounds.top || mouseY > chartBounds.bottom) {
|
||||
d3.select('.nvtooltip').remove();
|
||||
}
|
||||
});
|
||||
|
||||
nv.utils.windowResize(cumulativeProfitChart.update);
|
||||
return cumulativeProfitChart;
|
||||
});
|
||||
|
@ -490,20 +464,6 @@
|
|||
.transition().duration(0)
|
||||
.call(TCVChart);
|
||||
|
||||
// Add mouseleave, and mousemove event listeners to hide tooltip
|
||||
d3.select('.TCV-chart').on('mouseleave', function() {
|
||||
d3.select('.nvtooltip').remove();
|
||||
});
|
||||
|
||||
d3.select('body').on('mousemove', function() {
|
||||
var chartBounds = d3.select('.TCV-chart')[0][0].getBoundingClientRect();
|
||||
var mouseX = d3.event.clientX;
|
||||
var mouseY = d3.event.clientY;
|
||||
|
||||
if (mouseX < chartBounds.left || mouseX > chartBounds.right || mouseY < chartBounds.top || mouseY > chartBounds.bottom) {
|
||||
d3.select('.nvtooltip').remove();
|
||||
}
|
||||
});
|
||||
nv.utils.windowResize(TCVChart.update);
|
||||
return TCVChart;
|
||||
});
|
||||
|
@ -561,20 +521,6 @@
|
|||
});
|
||||
|
||||
|
||||
// Add mouseleave, and mousemove event listeners to hide tooltip
|
||||
d3.select('.profit-chart').on('mouseleave', function() {
|
||||
d3.select('.nvtooltip').remove();
|
||||
});
|
||||
|
||||
d3.select('body').on('mousemove', function() {
|
||||
var chartBounds = d3.select('.profit-chart')[0][0].getBoundingClientRect();
|
||||
var mouseX = d3.event.clientX;
|
||||
var mouseY = d3.event.clientY;
|
||||
|
||||
if (mouseX < chartBounds.left || mouseX > chartBounds.right || mouseY < chartBounds.top || mouseY > chartBounds.bottom) {
|
||||
d3.select('.nvtooltip').remove();
|
||||
}
|
||||
});
|
||||
nv.utils.windowResize(profitChart.update);
|
||||
return profitChart;
|
||||
});
|
||||
|
@ -582,4 +528,34 @@
|
|||
}
|
||||
})(jQuery);
|
||||
</script>
|
||||
|
||||
<script type="text/javascript">
|
||||
function attachTooltipRemoval(chartClass) {
|
||||
d3.selectAll(chartClass).on('mouseleave', function() {
|
||||
var tooltip = d3.select(this).select('.nvtooltip');
|
||||
if (!tooltip.empty()) {
|
||||
tooltip.style('opacity', 0);
|
||||
}
|
||||
});
|
||||
|
||||
d3.selectAll(chartClass).on('mouseenter', function() {
|
||||
var tooltip = d3.select(this).select('.nvtooltip');
|
||||
if (!tooltip.empty()) {
|
||||
tooltip.style('opacity', 1);
|
||||
}
|
||||
});
|
||||
}
|
||||
$(document).ready(function () {
|
||||
// Hide all tooltips when the page is loaded
|
||||
d3.selectAll('.nvtooltip').style('opacity', 0);
|
||||
|
||||
// Call the function for each chart
|
||||
attachTooltipRemoval('.asset-distribution svg');
|
||||
attachTooltipRemoval('.trend-chart svg');
|
||||
attachTooltipRemoval('.profit-chart svg');
|
||||
attachTooltipRemoval('.TCVLive-chart svg');
|
||||
// Add other charts as needed
|
||||
});
|
||||
</script>
|
||||
|
||||
}
|
||||
|
|
|
@ -493,33 +493,30 @@
|
|||
</script>
|
||||
|
||||
<script type="text/javascript">
|
||||
function attachTooltipRemoval(chartClass) {
|
||||
d3.selectAll(chartClass).on('mouseleave', function() {
|
||||
var tooltip = d3.select(this).select('.nvtooltip');
|
||||
if (!tooltip.empty()) {
|
||||
tooltip.style('opacity', 0);
|
||||
function attachTooltipRemoval(chartClass) {
|
||||
d3.selectAll(chartClass).on('mouseleave', function() {
|
||||
var tooltip = d3.select(this).select('.nvtooltip');
|
||||
if (!tooltip.empty()) {
|
||||
tooltip.style('opacity', 0);
|
||||
}
|
||||
});
|
||||
|
||||
d3.selectAll(chartClass).on('mouseenter', function() {
|
||||
var tooltip = d3.select(this).select('.nvtooltip');
|
||||
if (!tooltip.empty()) {
|
||||
tooltip.style('opacity', 1);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
d3.selectAll(chartClass).on('mouseenter', function() {
|
||||
var tooltip = d3.select(this).select('.nvtooltip');
|
||||
if (!tooltip.empty()) {
|
||||
tooltip.style('opacity', 1);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
$(document).ready(function () {
|
||||
// Hide all tooltips when the page is loaded
|
||||
d3.selectAll('.nvtooltip').style('opacity', 0);
|
||||
|
||||
// Call the function for each chart
|
||||
attachTooltipRemoval('.asset-distribution svg');
|
||||
attachTooltipRemoval('.trend-chart svg');
|
||||
attachTooltipRemoval('.profit-chart svg');
|
||||
attachTooltipRemoval('.TCVLive-chart svg');
|
||||
// Add other charts as needed
|
||||
});
|
||||
$(document).ready(function () {
|
||||
// Hide all tooltips when the page is loaded
|
||||
d3.selectAll('.nvtooltip').style('opacity', 0);
|
||||
|
||||
// Call the function for each chart
|
||||
attachTooltipRemoval('.asset-distribution svg');
|
||||
attachTooltipRemoval('.trend-chart svg');
|
||||
attachTooltipRemoval('.profit-chart svg');
|
||||
attachTooltipRemoval('.TCVLive-chart svg');
|
||||
// Add other charts as needed
|
||||
});
|
||||
</script>
|
||||
|
|
Loading…
Reference in New Issue