diff --git a/index.html b/index.html index ea33a0a..2dd00a6 100644 --- a/index.html +++ b/index.html @@ -239,41 +239,29 @@ "minPeriod": "mm", "labelRotation": 25, guides: [{ - date: "2017-1-8", toDate: "2017-1-9", - fillAlpha: 0.1, fillColor: "#f08080", fillAlpha: 0.1, lineAlpha: 0 - },{ - date: "2017-1-7", toDate: "2017-1-8", - fillAlpha: 0.1, fillColor: "#8080f0", fillAlpha: 0.1, lineAlpha: 0 - },{ - date: "2017-1-1", toDate: "2017-1-2", - fillAlpha: 0.1, fillColor: "#f08080", fillAlpha: 0.1, lineAlpha: 0 - },{ - date: "2016-12-31 0:0", toDate: "2017-1-1 0:0", - fillAlpha: 0.1, fillColor: "#8080f0", fillAlpha: 0.1, lineAlpha: 0 - },{ date: "2016-12-24 0:0", toDate: "2016-12-25 0:0", - fillAlpha: 0.1, fillColor: "#8080f0", fillAlpha: 0.1, lineAlpha: 0 + fillColor: "#8080f0", fillAlpha: 0.1, lineAlpha: 0 },{ date: "2016-12-25 0:0", toDate: "2016-12-26 0:0", - fillAlpha: 0.1, fillColor: "#f08080", fillAlpha: 0.1, lineAlpha: 0 + fillColor: "#f08080", fillAlpha: 0.1, lineAlpha: 0 },{ date: "2016-12-17 0:0", toDate: "2016-12-18 0:0", - fillAlpha: 0.1, fillColor: "#8080f0", fillAlpha: 0.1, lineAlpha: 0 + fillColor: "#8080f0", fillAlpha: 0.1, lineAlpha: 0 },{ date: "2016-12-18 0:0", toDate: "2016-12-19 0:0", - fillAlpha: 0.1, fillColor: "#f08080", fillAlpha: 0.1, lineAlpha: 0 + fillColor: "#f08080", fillAlpha: 0.1, lineAlpha: 0 },{ date: "2016-12-10 0:0", toDate: "2016-12-11 0:0", - fillAlpha: 0.1, fillColor: "#8080f0", fillAlpha: 0.1, lineAlpha: 0 + fillColor: "#8080f0", fillAlpha: 0.1, lineAlpha: 0 },{ date: "2016-12-11 0:0", toDate: "2016-12-12 0:0", - fillAlpha: 0.1, fillColor: "#f08080", fillAlpha: 0.1, lineAlpha: 0 + fillColor: "#f08080", fillAlpha: 0.1, lineAlpha: 0 },{ date: "2016-12-03 0:0", toDate: "2016-12-04 0:0", - fillAlpha: 0.1, fillColor: "#8080f0", fillAlpha: 0.1, lineAlpha: 0 + fillColor: "#8080f0", fillAlpha: 0.1, lineAlpha: 0 },{ date: "2016-12-04 0:0", toDate: "2016-12-05 0:0", - fillAlpha: 0.1, fillColor: "#f08080", fillAlpha: 0.1, lineAlpha: 0 + fillColor: "#f08080", fillAlpha: 0.1, lineAlpha: 0 }], }, "mouseWheelZoomEnabled": true, @@ -367,6 +355,7 @@ var w = 14, unit=18; var path = document.createElementNS("http://www.w3.org/2000/svg", "path"); + cht.locktoggle = true; path.setAttribute("stroke", color); path.setAttribute("stroke-width", 4); path.setAttribute("fill", "white"); @@ -378,9 +367,18 @@ svg = document.getElementById(idgroup); svg.appendChild(path); - - path.addEventListener("mouseenter", function(){emphasize(cht, from, to);path.setAttribute("stroke-width", 10);}); - path.addEventListener("mouseleave", function(){emphasize(cht, from, -to);path.setAttribute("stroke-width", 4);}); + path.addEventListener("mouseenter", function(){if(cht.locktoggle){ + emphasize(cht, from, to);path.setAttribute("stroke-width", 10);}}); + path.addEventListener("mouseleave", function(){if(cht.locktoggle){ + emphasize(cht, from, -to);path.setAttribute("stroke-width", 4);}}); + path.addEventListener("click", function(){ + if (cht.locktoggle) { + path.setAttribute("stroke-width", 14); + cht.locktoggle = false; + } else { + path.setAttribute("stroke-width", 10); + cht.locktoggle = true; + }}); } makeGroup(tempchart, "tempgroup", 0, 2, "blue");