1
2
3
4
5
|
/*!
* rspamd-D3Pie 0.0.1 (https://github.com/moisseev/rspamd-D3Pie)
* Copyright (c) 2022, Alexander Moisseev, BSD 2-Clause
*/
function D3Pie(t,e){"use strict";const a=$.extend(!0,{canvasPadding:5,cornerRadius:3,duration:1250,gradient:{enabled:!0,percentage:100},labels:{inner:{hideWhenLessThanPercentage:4,offset:.15},outer:{collideHeight:13,format:"label",pieDistance:30}},padAngle:.01,pieCenterOffset:{x:0,y:0},size:{canvasHeight:400,canvasWidth:600,pieInnerRadius:"20%",pieOuterRadius:"85%"},title:""},e);this.destroy=function(){d3.selectAll("#"+t+" svg, #"+t+"-tooltip").remove()},this.destroy();const n=d3.select("#"+t).append("svg").attr("class","d3pie").attr("width",a.size.canvasWidth).attr("height",a.size.canvasHeight);let l=0;if(""!==a.title){const t=n.append("svg:text").attr("class","chart-title").attr("x",a.size.canvasWidth/2);t.append("tspan").text(a.title+" "),l=t.node().getBBox().height,t.attr("y",l+a.canvasPadding)}const r=n.append("g").attr("transform","translate("+(a.size.canvasWidth/2+a.pieCenterOffset.x)+","+(a.size.canvasHeight/2+l/2+a.pieCenterOffset.y)+")"),i={},o={},{outerRadius:s,innerRadius:d}=function(){function t(t,e){if(!/%/u.test(t))return parseInt(t,10);const a=Math.max(0,Math.min(99,parseInt(t.replace(/[\D]/u,""),10)))/100;return Math.floor(e*a)}const e=a.size.canvasWidth-2*a.canvasPadding,n=a.size.canvasHeight-2*a.canvasPadding-l;let r=Math.min(e,n)/2;if("none"!==a.labels.outer.format){const t=parseInt(a.labels.outer.pieDistance,10);r>t&&(r-=t)}const i=t(a.size.pieOuterRadius,r);return{outerRadius:i,innerRadius:t(a.size.pieInnerRadius,i)}}(),c=s+a.labels.outer.pieDistance,u=d3.line().curve(d3.curveCatmullRomOpen),f=d3.select("body").append("div").attr("id",t+"-tooltip").attr("class","d3pie-tooltip"),p=f.append("span").attr("id",t+"-tooltip-text"),g=n.append("defs");this.data=function(e){let n=$.extend(!0,[],e);const l=[],h=n.reduce(function(t,e){return t+(e.value||0)},0);f.datum({total:h}),n.unshift({label:"undefined",color:a.gradient.enabled?"steelblue":"#ecf1f5",value:0===h?1:0});const b=d3.scaleOrdinal(d3.schemeSet1);function v(t,e){return void 0!==t&&void 0!==t.color?t.color:b(e)}function A(t,e,a=e){return d3.arc().innerRadius(e).outerRadius(a).centroid(t)}function x(t){return d3.interpolate(i[t.data.label],t)}function m(t){const e=c-.1;return Math.max(-e,Math.min(e,t))}const y=d3.transition().duration(a.duration);if(a.gradient.enabled){const e=g.selectAll("radialGradient").data(n,function(t){return t.label}).enter().append("radialGradient").attr("gradientUnits","userSpaceOnUse").attr("cx",0).attr("cy",0).attr("r","120%").attr("id",function(e,a){return t+"-grad"+a});e.append("stop").attr("class","grad-stop-0").style("stop-color",function(t,e){return v(t,e)}),e.append("stop").attr("class","grad-stop-1").attr("offset",a.gradient.percentage+"%"),g.selectAll("radialGradient").select(".grad-stop-0").transition(y).style("stop-color",function(t,e){return v(t,e)})}function M(t){return t.data.label}const R=d3.pie().sort(null).value(function(t){return t.value}),w=r.selectAll(".slice-g").data(R(n),M),P=w.enter().append("g").attr("class","slice-g").on("mouseover",function(t){const e=f.datum().total,a=e?Math.round(100*t.data.value/e):NaN;t.data.value?(f.transition().duration(300).style("opacity",1),p.text(t.data.label+(e?": "+t.data.value+" ("+a+"%)":""))):f.transition().duration(300).style("opacity",0),f.each(function(t){t.height=this.getBoundingClientRect().height})}).on("mouseout",function(){f.transition().duration(300).style("opacity",0)}).on("mousemove",function(){const{pageX:t,pageY:e}=d3.event;f.style("left",t+"px").style("top",function(t){return e-t.height-2+"px"})});if(P.append("path").attr("id",function(e,a){return t+"-slice"+a}).attr("class","slice").attr("fill",function(e,n){return a.gradient.enabled?"url(#"+t+"-grad"+n+")":v(e.data,n)}),w.exit().each(function(t,e){n[e]={value:0,label:t.data.label}}),R(n).forEach(function(t,e){if(void 0===i[t.data.label]){const a=e?i[R(n)[e-1].data.label].endAngle:0;i[t.data.label]={startAngle:a,endAngle:a}}}),r.selectAll(".slice").data(R(n),M).transition(y).attrTween("d",function(t){return function(e){return d3.arc().padAngle(a.padAngle).cornerRadius(a.cornerRadius).innerRadius(d).outerRadius(s)(x(t)(e))}}).end().then(function(){n=n.filter(function(t,e){return 0===e||t.value}),g.selectAll("radialGradient").data(n,function(t){return t.label}).exit().remove(),r.selectAll(".slice-g").data(R(n),M).exit().each(function(t){delete i[t.data.label],delete o[t.data.label]}).remove();for(const t of R(n))i[t.data.label]=t,"none"!==a.labels.outer.format&&(o[t.data.label].currentAngle=o[t.data.label].newAngle)}).catch(function(t){console.warn(t)}),P.append("text").attr("class","inner-label").attr("dy",".35em"),r.selectAll(".inner-label").data(R(n),M).text(function(t){return"undefined"===t.data.label?"undefined":Math.round(100*t.data.value/h)+"%"}).transition(y).attrTween("opacity",function(t){return t.data.value?function(e){const n=x(t)(e);return 100*(n.endAngle-n.startAngle)/(2*Math.PI)<a.labels.inner.hideWhenLessThanPercentage?0:1}:function(){return 0}}).attrTween("transform",function(t){return function(e){return"translate("+A(x(t)(e),d*(1-a.labels.inner.offset),s*(1+a.labels.inner.offset))+")"}}),"none"!==a.labels.outer.format){R(n).forEach(function(t,e){if(void 0===o[t.data.label]){const a=e?i[R(n)[e-1].data.label].endAngle:0;o[t.data.label]={currentAngle:{startAngle:a,endAngle:a},newAngle:{startAngle:a,endAngle:a}}}let r=0;const[s,d]=A(t,c);t.data.value&&(r=s>=0?a.labels.outer.collideHeight:-a.labels.outer.collideHeight),l.push({fx:r,y:d})}),d3.forceSimulation(l).alphaMin(.5).force("collide",d3.forceCollide(a.labels.outer.collideHeight/2)).force("boundY",function(){for(const t of l)t.y=m(t.y)}).tick(30);const t=P.append("g").attr("class","outer-label-g");t.append("text").attr("class","outer-label").attr("dy",".35em").text(M),t.append("path").attr("class","link"),r.selectAll(".outer-label-g").data(R(n),M).transition(y).style("opacity",function(t,e){return e&&t.value?1:0}).each(function(t,e){$(this).children(".link").attr("stroke",v(t.data,e))}),r.selectAll(".outer-label").data(R(n),M).transition(y).attrTween("transform",function(t,e){o[t.data.label].newAngle=function(){const a=m(l[e].y);let n=Math.sqrt(Math.pow(c,2)-Math.pow(a,2));(t.endAngle+t.startAngle)/2>Math.PI&&(n*=-1);let r=Math.PI/2-Math.atan2(-a,n);return r<0&&(r+=2*Math.PI),{startAngle:r,endAngle:r}}();const a=d3.interpolate(o[t.data.label].currentAngle,o[t.data.label].newAngle);return function(n){const l=A(a(n),c),[i,o]=l,d=i>0?{dx:5,textAnchor:"start"}:{dx:-5,textAnchor:"end"};return d3.select(r.selectAll(".link").nodes()[e]).datum([A(x(t)(n),s),A(x(t)(n),s+5),[i,o],[i+d.dx,o]]).attr("d",u),d3.select(r.selectAll(".outer-label").nodes()[e]).attr("dx",d.dx).style("text-anchor",d.textAnchor),"translate("+l+")"}})}}}
|
