aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorAlexander Moisseev <moiseev@mezonplus.ru>2017-11-28 13:46:54 +0300
committerAlexander Moisseev <moiseev@mezonplus.ru>2017-11-28 13:46:54 +0300
commitc51c8068dc0bad7dfb7c4d33ab6c560f6e804874 (patch)
tree115daf29dcc2521848dcd6e7e1b5c14e464f1a5b
parentafbdb46486b938645dec4475644c5974a74acbd6 (diff)
downloadrspamd-c51c8068dc0bad7dfb7c4d33ab6c560f6e804874.tar.gz
rspamd-c51c8068dc0bad7dfb7c4d33ab6c560f6e804874.zip
[WebUI] Update D3Evolution 1.0.0 -> 1.1.0
+ Add logarithmic vertical scale
-rw-r--r--interface/index.html5
-rw-r--r--interface/js/app/graph.js4
-rw-r--r--interface/js/lib/d3evolution.min.js6
3 files changed, 12 insertions, 3 deletions
diff --git a/interface/index.html b/interface/index.html
index 9366f7357..42f4d0043 100644
--- a/interface/index.html
+++ b/interface/index.html
@@ -129,6 +129,11 @@
<option value="weekly">Weekly</option>
<option value="monthly">Monthly</option>
</select>
+ Select Y-scale:
+ <select id="selYScale" class="form-control">
+ <option value="lin" selected>Lin</option>
+ <option value="log">Log</option>
+ </select>
Convert to:
<select id="selConvert" class="form-control">
<option value="" selected>--</option>
diff --git a/interface/js/app/graph.js b/interface/js/app/graph.js
index c082e6a3c..bc5802995 100644
--- a/interface/js/app/graph.js
+++ b/interface/js/app/graph.js
@@ -90,10 +90,14 @@ function($, D3Evolution, unused) {
function initGraph() {
var graph = new D3Evolution("graph", $.extend({}, graph_options, {
+ yScale: getSelector("selYScale"),
type: getSelector("selType"),
interpolate: getSelector("selInterpolate"),
convert: getSelector("selConvert"),
}));
+ $("#selYScale").change(function() {
+ graph.yScale(this.value);
+ });
$("#selConvert").change(function () {
graph.convert(this.value);
});
diff --git a/interface/js/lib/d3evolution.min.js b/interface/js/lib/d3evolution.min.js
index 8e9189b6d..b7641ac4e 100644
--- a/interface/js/lib/d3evolution.min.js
+++ b/interface/js/lib/d3evolution.min.js
@@ -1,5 +1,5 @@
-/*!
- * D3Evolution 1.0.0 (https://github.com/moisseev/D3Evolution)
+/*
+ * D3Evolution 1.1.0 (https://github.com/moisseev/D3Evolution)
* Copyright (c) 2016-2017, Alexander Moisseev, BSD 2-Clause
*/
-;function D3Evolution(s,e){var o=$.extend(true,{title:"",width:800,height:400,margin:{top:80,right:60,bottom:40,left:60},yAxisLabel:"",type:"line",duration:1250,interpolate:"curveLinear",legend:{buttonRadius:7,space:130,entries:[]}},e);const k={curveLinear:d3.curveLinear,curveStep:d3.curveStep,curveStepBefore:d3.curveStepBefore,curveStepAfter:d3.curveStepAfter,curveMonotoneX:d3.curveMonotoneX,curveBasis:d3.curveBasis,curveBasisOpen:d3.curveBasisOpen,curveBundle:d3.curveBundle,curveCardinal:d3.curveCardinal,curveCardinalOpen:d3.curveCardinalOpen,curveCatmullRom:d3.curveCatmullRom,curveCatmullRomOpen:d3.curveCatmullRomOpen,curveNatural:d3.curveNatural};var C;var z;var l;var t=o.width-o.margin.left-o.margin.right;var r=o.height-o.margin.top-o.margin.bottom;var E=d3.scaleTime().range([0,t]);var d=d3.scaleLinear().range([r,0]);var i=d3.axisBottom().scale(E);var a=d3.axisLeft().scale(d).ticks(5);var n=d3.axisBottom().tickFormat("").scale(E).tickSize(-r,0);var F=d3.axisLeft().tickFormat("").scale(d).tickSize(-t,0);var m=d3.scaleQuantize().range([r,0]);var p=d3.area().x(function(g){return E(g.x)}).y0(function(g){return r}).y1(function(g){return m(g.y==null)}).curve(d3.curveStep);var j=d3.line().defined(function(g){return g.y!=null}).x(function(g){return E(g.x)}).y(function(g){return d(g.y)}).curve(k[o.interpolate]);var y=d3.area().defined(function(g){return g.y!=null}).x(function(g){return E(g.x)}).y0(function(g){return d(g.y0)}).y1(function(g){return d(g.y0+g.y)}).curve(k[o.interpolate]);var B=function(g){g.reduce(function(G,H){H.map(function(J,I){J.y0=(G.length?G[I].y+G[I].y0:0)});return H},[])};var h=function(){var g;if(o.type==="area"){B(C);g=d3.extent(d3.merge(C),function(H){return H.y0+H.y})}else{g=d3.extent(d3.merge(C),function(H){return H.y})}d.domain([(g[0]>0)?0:g[0],g[1]]);const G=d3.transition().duration(o.duration);x.select(".y.grid").transition(G).call(F.scale(d));x.select(".y.axis").transition(G).call(a.scale(d))};var A=d3.scaleOrdinal(d3.schemeCategory10);var b=function(g){return(o.legend.entries[g]!==undefined&&o.legend.entries[g].color!==undefined)?o.legend.entries[g].color:A(g)};var w=function(g){return(o.legend.entries[g]!==undefined&&o.legend.entries[g].label!==undefined)?o.legend.entries[g].label:"path_"+g};var f=function(g){var H=g.reduce(function(I,J){return J.map(function(L,K){return L.y+(I[K]?I[K]:0)})},[]);var G=$.extend(true,[],g);G.forEach(function(I){I.forEach(function(K,J){if(H[J]){K.y/=H[J]}})});return G};var v=function(){if(o.convert==="percentage"){a.tickFormat(d3.format(".0%"));u.transition().duration(o.duration).style("opacity",0);C=f(z)}else{a.tickFormat(null);u.transition().duration(o.duration).style("opacity",1);C=z}h()};var q=d3.select("#"+s).append("svg").classed("d3evolution",true).attr("width",o.width).attr("height",o.height);var c=q.append("g").attr("class","legend");var x=q.append("g").attr("width",t).attr("height",r).attr("transform","translate("+o.margin.left+", "+o.margin.top+")");x.append("g").attr("class","x grid").attr("transform","translate(0,"+r+")").call(n);x.append("g").attr("class","y grid").attr("transform","translate(0,0)").call(F);x.append("g").attr("class","x axis").attr("transform","translate(0,"+r+")").call(i);x.append("g").attr("class","y axis").attr("transform","translate(0,0)").call(a);var u=x.append("text").attr("class","y label").attr("x",20-o.margin.left).attr("y",-20).style("opacity",(o.convert==="percentage")?0:1).text(o.yAxisLabel);var D=q.append("svg:text").attr("x",(o.width/2)).attr("y",(o.margin.top/3)).attr("text-anchor","middle");D.append("tspan").attr("class","chart-title").text(o.title+" ");D.timeRange=D.append("tspan");this.data=function(K){z=$.extend(true,[],K);var H=[];l=o.width-o.margin.right-o.legend.space*z.length;z.forEach(function(Q){Q.forEach(function(R){R.x*=1000})});var L=d3.extent(d3.merge(z),function(Q){return Q.x});E.domain([L[0],L[1]]);const P=function(Q){return d3.timeFormat("%Y-%m-%d %H:%M:%S")(new Date(Q))};D.timeRange.text("[ "+P(L[0])+" / "+P(L[1])+" ]");var M=x.selectAll("path.path-null").data(z);M.enter().append("path").attr("class","path-null");x.selectAll("path.path-null").transition().duration(o.duration/2).style("opacity",0).on("end",function(){x.selectAll("path.path-null").attr("d",p).transition().duration(o.duration/2).style("opacity",1)});M.exit().remove();v();var O=x.selectAll("path.path").data(C);O.enter().append("path").merge(O).attr("class","path").attr("id",function(R,Q){return"path_"+Q}).on("click",function(R,Q){J(Q)}).on("mouseover",function(R,Q){g(Q)}).on("mouseout",function(R,Q){g(Q,false)});O.exit().remove();O=x.selectAll("path.path");if(o.type==="area"){O.style("fill",function(R,Q){return b(Q)}).style("stroke","none").style("fill-opacity",function(R,Q){return H[Q]})}else{O.style("fill","none").style("stroke",function(R,Q){return b(Q)}).style("opacity",function(R,Q){return H[Q]})}O.transition().duration(o.duration).attr("d",(o.type==="area")?y:j);const N=d3.transition().duration(o.duration);x.select(".x.grid").transition(N).call(n.scale(E));x.select(".x.axis").transition(N).call(i.scale(E));var J=function(Q){H[Q]=(H[Q]!=0)?0:1;d3.select("#circle_"+Q).transition().duration(o.duration).style("fill-opacity",H[Q]+0.2);d3.select("#path_"+Q).transition().duration(o.duration).style("opacity",H[Q])};const g=function(R,Q){d3.select("#circle_"+R).attr("r",o.legend.buttonRadius*(Q===false?1:1.3));const S=function(T){if(Q===false){return H[T]}return(T===R)?1:(H[T]==0)?0:0.4};x.selectAll("path.path").style("opacity",function(U,T){return S(T)}).style("fill-opacity",function(U,T){return S(T)})};var I=c.selectAll("circle").data(C);I.enter().append("circle").attr("id",function(R,Q){return"circle_"+Q}).attr("cy",o.margin.top*2/3).attr("r",o.legend.buttonRadius).style("fill",function(R,Q){return b(Q)}).style("stroke",function(R,Q){return b(Q)}).style("fill-opacity",function(R,Q){return H[Q]+0.2}).on("click",function(R,Q){J(Q)}).on("mouseover",function(R,Q){g(Q)}).on("mouseout",function(R,Q){g(Q,false)});I.exit().remove();c.selectAll("circle").transition().duration(o.duration).attr("cx",function(R,Q){return l+o.legend.space*Q});var G=c.selectAll("text").data(C);G.enter().append("text").attr("y",o.margin.top*2/3).attr("dy","0.3em").text(function(R,Q){return w(Q)}).on("click",function(R,Q){J(Q)}).on("mouseover",function(R,Q){g(Q)}).on("mouseout",function(R,Q){g(Q,false)});G.exit().remove();c.selectAll("text").transition().duration(o.duration).attr("x",function(R,Q){return l+o.legend.space*Q+2*o.legend.buttonRadius});return this};this.legend=function(g){$.extend(true,o.legend,g);c.selectAll("circle").transition().duration(o.duration).attr("cx",function(H,G){return l+o.legend.space*G}).attr("r",o.legend.buttonRadius).style("fill",function(H,G){return b(G)}).style("stroke",function(H,G){return b(G)});c.selectAll("text").text(function(H,G){return w(G)}).transition().duration(o.duration).attr("x",function(H,G){return l+o.legend.space*G+2*o.legend.buttonRadius});x.selectAll("path.path").transition().duration(o.duration).style("fill",(o.type==="area")?function(H,G){return b(G)}:"none").style("stroke",(o.type!=="area")?function(H,G){return b(G)}:"none");return this};this.convert=function(g){o.convert=g;v();x.selectAll("path.path").data(C).transition().duration(o.duration).attr("d",(o.type==="area")?y:j);return this};this.interpolate=function(g){o.interpolate=g;y.curve(k[o.interpolate]);j.curve(k[o.interpolate]);x.selectAll("path.path").attr("d",(o.type==="area")?y:j);return this};this.type=function(g){o.type=g;h();x.selectAll("path.path").style("stroke",(o.type!=="area")?function(H,G){return b(G)}:"none").style("fill",(o.type==="area")?function(H,G){return b(G)}:"none").transition().duration(o.duration).attr("d",(o.type==="area")?y:j);return this};this.yAxisLabel=function(g){o.yAxisLabel=g;u.transition().duration(o.duration/2).style("opacity",0).on("end",function(){u.text(o.yAxisLabel).transition().duration(o.duration/2).style("opacity",1)});return this};this.destroy=function(){d3.select("svg").remove()}}; \ No newline at end of file
+function D3Evolution(A,r){var u=$.extend(true,{title:"",width:800,height:400,margin:{top:80,right:60,bottom:40,left:60},yAxisLabel:"",type:"line",yScale:"lin",duration:1250,interpolate:"curveLinear",legend:{buttonRadius:7,space:130,entries:[]}},r);const b={curveLinear:d3.curveLinear,curveStep:d3.curveStep,curveStepBefore:d3.curveStepBefore,curveStepAfter:d3.curveStepAfter,curveMonotoneX:d3.curveMonotoneX,curveBasis:d3.curveBasis,curveBasisOpen:d3.curveBasisOpen,curveBundle:d3.curveBundle,curveCardinal:d3.curveCardinal,curveCardinalOpen:d3.curveCardinalOpen,curveCatmullRom:d3.curveCatmullRom,curveCatmullRomOpen:d3.curveCatmullRomOpen,curveNatural:d3.curveNatural,};var K;var G;var m;var a=u.width-u.margin.left-u.margin.right;var c=u.height-u.margin.top-u.margin.bottom;var l=d3.scaleTime().range([0,a]);var E;var i;const t=function(){if(u.yScale==="log"){E=d3.scaleLog().clamp(true).range([c,0]);i=d3.scaleLog().range([c-30,0])}else{E=d3.scaleLinear().range([c,0]);i=E.copy()}};t();var p=d3.axisBottom().scale(l);var h=d3.axisLeft().scale(i).ticks(5);var H=d3.axisBottom().tickFormat("").scale(l).tickSize(-c,0);var k=d3.axisLeft().tickFormat("").scale(i).tickSize(-a,0);var B=d3.scaleQuantize().range([c,0]);var v=d3.area().x(function(g){return l(g.x)}).y0(function(g){return c}).y1(function(g){return B(g.y==null)}).curve(d3.curveStep);var j=d3.line().defined(function(g){return g.y!=null}).x(function(g){return l(g.x)}).y(function(g){return E(g.y)}).curve(b[u.interpolate]);var z=d3.area().defined(function(g){return g.y!=null}).x(function(g){return l(g.x)}).y0(function(g){return E(g.y0)}).y1(function(g){return E(g.y0+g.y)}).curve(b[u.interpolate]);var s=function(g){g.reduce(function(L,M){M.map(function(O,N){O.y0=(L.length?L[N].y+L[N].y0:0)});return M},[])};var q=function(){var g;if(u.type==="area"){s(K);g=(u.yScale==="log")?d3.extent(d3.merge(K),function(Q){return((Q.y0+Q.y)===0)?null:Q.y0+Q.y}):d3.extent(d3.merge(K),function(Q){return Q.y0+Q.y})}else{g=(u.yScale==="log")?d3.extent(d3.merge(K),function(Q){return(Q.y===0)?null:Q.y}):d3.extent(d3.merge(K),function(Q){return Q.y})}if(u.yScale==="log"){if(g[0]===undefined){g=[0.0095,0.0105]}else{if(g[0]===g[1]){g[0]*=0.9}}i.domain([g[0],g[1]]);var P=i.invert(c);E.domain([P,g[1]])}else{E.domain([(g[0]>0)?0:g[0],g[1]]);i.domain(E.domain())}function O(U,T,S){const R=15;const Q=Math.pow(10,Math.round(Math.log(U)/Math.LN10));if(!(Math.abs(Q-U)<0.000001)&&((Math.abs(E(Q)-E(U))<R)||((T.y-E(U))<R))){return""}T.y=E(U);return S(U)}if(u.convert==="percentage"){var L={y:c};const N=d3.format(".0%");y.tickFormat(N);h.tickFormat((u.yScale==="log")?function(Q){return O(Q,L,N)}:N)}else{y.tickFormat(null);h.tickFormat(null)}h.tickValues(!i.ticks().length?[g[0],g[1]]:null);const M=d3.transition().duration(u.duration);J.select(".y.grid").transition(M).call(k.scale(i));J.select(".y.axis").transition(M).call(h.scale(i));J.select(".y-zero.axis").call(y)};var D=d3.scaleOrdinal(d3.schemeCategory10);var w=function(g){return(u.legend.entries[g]!==undefined&&u.legend.entries[g].color!==undefined)?u.legend.entries[g].color:D(g)};var F=function(g){return(u.legend.entries[g]!==undefined&&u.legend.entries[g].label!==undefined)?u.legend.entries[g].label:"path_"+g};var f=function(g){var M=g.reduce(function(N,O){return O.map(function(Q,P){return Q.y+(N[P]?N[P]:0)})},[]);var L=$.extend(true,[],g);L.forEach(function(N){N.forEach(function(P,O){if(M[O]){P.y/=M[O]}})});return L};var I=function(){if(u.convert==="percentage"){n.transition().duration(u.duration).style("opacity",0);K=f(G)}else{n.transition().duration(u.duration).style("opacity",1);K=G}q()};const d=function(){if(u.yScale==="log"){const g=E.invert(c);K.forEach(function(L){L.forEach(function(N,M){return N.y==0?N.y:g})})}};var e=d3.select("#"+A).append("svg").classed("d3evolution",true).attr("width",u.width).attr("height",u.height);var C=e.append("g").attr("class","legend");var J=e.append("g").attr("width",a).attr("height",c).attr("transform","translate("+u.margin.left+", "+u.margin.top+")");J.append("g").attr("class","x grid").attr("transform","translate(0,"+c+")").call(H);J.append("g").attr("class","y grid").attr("transform","translate(0,0)").call(k);J.append("g").attr("class","x axis").attr("transform","translate(0,"+c+")").call(p);J.append("g").attr("class","y axis").attr("transform","translate(0,0)").call(h);var o=d3.scaleOrdinal().domain([0]).range([c]);var y=d3.axisLeft().scale(o);J.append("g").attr("class","y-zero axis").call(y);var n=J.append("text").attr("class","y label").attr("x",20-u.margin.left).attr("y",-20).style("opacity",(u.convert==="percentage")?0:1).text(u.yAxisLabel);var x=e.append("svg:text").attr("x",(u.width/2)).attr("y",(u.margin.top/3)).attr("text-anchor","middle");x.append("tspan").attr("class","chart-title").text(u.title+" ");x.timeRange=x.append("tspan");this.data=function(P){G=$.extend(true,[],P);var M=[];m=u.width-u.margin.right-u.legend.space*G.length;G.forEach(function(V){V.forEach(function(W){W.x*=1000})});var Q=d3.extent(d3.merge(G),function(V){return V.x});l.domain([Q[0],Q[1]]);const U=function(V){return d3.timeFormat("%Y-%m-%d %H:%M:%S")(new Date(V))};x.timeRange.text("[ "+U(Q[0])+" / "+U(Q[1])+" ]");var R=J.selectAll("path.path-null").data(G);R.enter().append("path").attr("class","path-null");J.selectAll("path.path-null").transition().duration(u.duration/2).style("opacity",0).on("end",function(){J.selectAll("path.path-null").attr("d",v).transition().duration(u.duration/2).style("opacity",1)});R.exit().remove();I();d();var T=J.selectAll("path.path").data(K);T.enter().append("path").merge(T).attr("class","path").attr("id",function(W,V){return"path_"+V}).on("click",function(W,V){O(V)}).on("mouseover",function(W,V){g(V)}).on("mouseout",function(W,V){g(V,false)});T.exit().remove();T=J.selectAll("path.path");if(u.type==="area"){T.style("fill",function(W,V){return w(V)}).style("stroke","none").style("fill-opacity",function(W,V){return M[V]})}else{T.style("fill","none").style("stroke",function(W,V){return w(V)}).style("opacity",function(W,V){return M[V]})}T.transition().duration(u.duration).attr("d",(u.type==="area")?z:j);const S=d3.transition().duration(u.duration);J.select(".x.grid").transition(S).call(H.scale(l));J.select(".x.axis").transition(S).call(p.scale(l));var O=function(V){M[V]=(M[V]!=0)?0:1;d3.select("#circle_"+V).transition().duration(u.duration).style("fill-opacity",M[V]+0.2);d3.select("#path_"+V).transition().duration(u.duration).style("opacity",M[V])};const g=function(W,V){d3.select("#circle_"+W).attr("r",u.legend.buttonRadius*(V===false?1:1.3));const X=function(Y){if(V===false){return M[Y]}return(Y===W)?1:(M[Y]==0)?0:0.4};J.selectAll("path.path").style("opacity",function(Z,Y){return X(Y)}).style("fill-opacity",function(Z,Y){return X(Y)})};var N=C.selectAll("circle").data(K);N.enter().append("circle").attr("id",function(W,V){return"circle_"+V}).attr("cy",u.margin.top*2/3).attr("r",u.legend.buttonRadius).style("fill",function(W,V){return w(V)}).style("stroke",function(W,V){return w(V)}).style("fill-opacity",function(W,V){return M[V]+0.2}).on("click",function(W,V){O(V)}).on("mouseover",function(W,V){g(V)}).on("mouseout",function(W,V){g(V,false)});N.exit().remove();C.selectAll("circle").transition().duration(u.duration).attr("cx",function(W,V){return m+u.legend.space*V});var L=C.selectAll("text").data(K);L.enter().append("text").attr("y",u.margin.top*2/3).attr("dy","0.3em").text(function(W,V){return F(V)}).on("click",function(W,V){O(V)}).on("mouseover",function(W,V){g(V)}).on("mouseout",function(W,V){g(V,false)});L.exit().remove();C.selectAll("text").transition().duration(u.duration).attr("x",function(W,V){return m+u.legend.space*V+2*u.legend.buttonRadius});return this};this.legend=function(g){$.extend(true,u.legend,g);C.selectAll("circle").transition().duration(u.duration).attr("cx",function(M,L){return m+u.legend.space*L}).attr("r",u.legend.buttonRadius).style("fill",function(M,L){return w(L)}).style("stroke",function(M,L){return w(L)});C.selectAll("text").text(function(M,L){return F(L)}).transition().duration(u.duration).attr("x",function(M,L){return m+u.legend.space*L+2*u.legend.buttonRadius});J.selectAll("path.path").transition().duration(u.duration).style("fill",(u.type==="area")?function(M,L){return w(L)}:"none").style("stroke",(u.type!=="area")?function(M,L){return w(L)}:"none");return this};this.convert=function(g){u.convert=g;I();J.selectAll("path.path").data(K).transition().duration(u.duration).attr("d",(u.type==="area")?z:j);return this};this.interpolate=function(g){u.interpolate=g;z.curve(b[u.interpolate]);j.curve(b[u.interpolate]);J.selectAll("path.path").attr("d",(u.type==="area")?z:j);return this};this.type=function(g){u.type=g;q();J.selectAll("path.path").style("stroke",(u.type!=="area")?function(M,L){return w(L)}:"none").style("fill",(u.type==="area")?function(M,L){return w(L)}:"none").transition().duration(u.duration).attr("d",(u.type==="area")?z:j);return this};this.yAxisLabel=function(g){u.yAxisLabel=g;n.transition().duration(u.duration/2).style("opacity",0).on("end",function(){n.text(u.yAxisLabel).transition().duration(u.duration/2).style("opacity",1)});return this};this.yScale=function(g){u.yScale=g;t();d();q();J.selectAll("path.path").transition().duration(u.duration).attr("d",(u.type==="area")?z:j);return this};this.destroy=function(){d3.select("svg").remove()}}; \ No newline at end of file