From 2a36f990fa5091702effde669b089596fe922d57 Mon Sep 17 00:00:00 2001 From: Richard Hitier Date: Wed, 19 May 2021 11:13:24 +0200 Subject: [PATCH] Remove tooltip hover on area --- app/main/static/js/charges.js | 36 +++++++++++++++++++----------------- 1 file changed, 19 insertions(+), 17 deletions(-) diff --git a/app/main/static/js/charges.js b/app/main/static/js/charges.js index a6d4928..a2729f9 100644 --- a/app/main/static/js/charges.js +++ b/app/main/static/js/charges.js @@ -37,6 +37,10 @@ function build_chart(div_selector, data_url, entity_name, category_type) { var draw_total_line = () => void 0; var draw_categories_bars = () => void 0; + var mouseoverlegend = category_mouseoverlegend; + var mouseleavelegend = category_mouseleavelegend; + + if (category_type == 'capacity') { chart_title = "Charges par fonction" category_title = "Fonction" @@ -61,6 +65,8 @@ function build_chart(div_selector, data_url, entity_name, category_type) { category_title = "Projet" draw_areas = draw_projects_areas colorScale = d3.scaleOrdinal(d3.schemeTableau10); + mouseoverlegend = () => void 0; + mouseleavelegend = () => void 0; } else { alert("ALERT ! Every body shall quit the boat, we are sinking ! ALERT !") } @@ -143,6 +149,7 @@ function build_chart(div_selector, data_url, entity_name, category_type) { var category_name = d3.select(this.parentNode).datum().key var category_charge = d.data[category_name] show_tooltip(e, category_name, category_charge) + console.log("HELLO") } var mouseovergrouped = function (e, d) { @@ -182,34 +189,34 @@ function build_chart(div_selector, data_url, entity_name, category_type) { .style("top", (e.pageY - tooltip_offset_dot.dy) + "px") } - function mouseoverlegend() { + function category_mouseoverlegend() { var legend_category = $(this).attr("class"); var bar_category = document.getElementsByClassName(legend_category); if (bar_category[0].tagName === "g") { var rect_to_hover = bar_category[0].children; (bar_category[1].children[0]).classList.add("brillance"); - for (var i=0;i=0;i--) { + for (var i = lenght_i; i >= 0; i--) { bar_category[i].classList.remove("brillance"); } } @@ -235,7 +242,7 @@ function build_chart(div_selector, data_url, entity_name, category_type) { .data(legend_keys) .enter() .append('g') - .attr('class', d=>d) + .attr('class', d => d) .on("mouseover", mouseoverlegend) .on("mouseleave", mouseleavelegend); @@ -257,8 +264,8 @@ function build_chart(div_selector, data_url, entity_name, category_type) { xpos; // Get Max legend key length for later display - const text_length_list = legend.selectAll('text.legend')._groups.map(el=>el[0].getComputedTextLength()) - const keycol_length = Math.max(...text_length_list) + 40 + const text_length_list = legend.selectAll('text.legend')._groups.map(el => el[0].getComputedTextLength()) + const keycol_length = Math.max(...text_length_list) + 40 legend .attr("transform", function (d, i) { @@ -347,7 +354,7 @@ function build_chart(div_selector, data_url, entity_name, category_type) { } - function ymax_from_stacked(stacked_data){ + function ymax_from_stacked(stacked_data) { // Get the max y to plot // If no data at all, force to 0 @@ -377,7 +384,7 @@ function build_chart(div_selector, data_url, entity_name, category_type) { var stacked_data = stack(data) const y_max = ymax_from_stacked(stacked_data); - yScale.domain([0, y_max ]); + yScale.domain([0, y_max]); const area = d3.area() .x(d => xScale(d.data.period)) @@ -395,11 +402,6 @@ function build_chart(div_selector, data_url, entity_name, category_type) { .append("title") .text(({key}) => key); - paths.selectAll("area") - .on("mouseover", mouseover) - .on("mousemove", mousemove) - .on("mouseleave", mouseleave); - } @@ -414,7 +416,7 @@ function build_chart(div_selector, data_url, entity_name, category_type) { var stacked_data = stack(data) const y_max = ymax_from_stacked(stacked_data); - yScale.domain([0, y_max ]); + yScale.domain([0, y_max]); // first draw one group for one category containing all bars over periods let groups = svg.selectAll("g.category") -- libgit2 0.21.2