diff --git a/app/main/static/css/charges.css b/app/main/static/css/charges.css index 903f15f..c2b02bf 100644 --- a/app/main/static/css/charges.css +++ b/app/main/static/css/charges.css @@ -90,7 +90,53 @@ rect.bar:hover { pointer-events: none; } -button.export { - float: right; - margin-right: 0; +i.export { + padding: 7px; + position: absolute; + margin-top:8px; + right: 3%; +} + +i.export:hover { + background: lightgrey; + border-radius: 2px; +} + +.tooltip_hamburger { + border-radius: 0px; + box-shadow: 2px 2px 2px 2px darkgrey; + right: 2%; + pointer-events: auto; + width: 150px; + margin-top:15px; + padding: 0; +} + +.tooltip_hamburger li { + list-style: none; + padding: 5px; + cursor: pointer; + pointer-events: auto; +} + +.tooltip_hamburger li:hover { + background-color: lightgrey; +} + +.tooltip_hamburger span { + width: 90%; + padding: 5px; + margin-left: 5px; + display: block; + border-bottom: 1px solid grey; +} + +.rectmouseleave { + width: 200px; + height: 150px; + position: absolute; + padding: 10px; + top:0; + right: 0; + /*background-color: #0b2e13;*/ } \ No newline at end of file diff --git a/app/main/static/js/charges.js b/app/main/static/js/charges.js index 2500a34..d352b9d 100644 --- a/app/main/static/js/charges.js +++ b/app/main/static/js/charges.js @@ -65,11 +65,39 @@ function build_chart(div_selector, data_url, entity_name, category_type) { alert("ALERT ! Every body shall quit the boat, we are sinking ! ALERT !") } + // Configure the tooltip to export svg to png or csv + var update_export_menu = function (e, d) { + + const tooltip_test = document.getElementsByClassName('tooltip_hamburger'); + + if (tooltip_test.length == 0) { + d3.select(".tooltip_hamburger").remove(); + + const tooltip_hamburger = hamburger.append("div") + .style("opacity", 0) + .attr("class", "tooltip tooltip_hamburger"); + + d3.select(this).transition() + .duration(1) + tooltip_hamburger + .transition() + .duration(200) + .style("opacity", 1) + tooltip_hamburger + .html("Export " + + "