on-codemerge
Version:
A WYSIWYG editor for on-codemerge is a user-friendly interface that allows users to edit and view their code in real time, exactly as it will appear in the final product
2 lines (1 loc) • 1.75 kB
JavaScript
;Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const M=require("./BaseChartRenderer.cjs");class v extends M.BaseChartRenderer{render(e,o,s){if(!o||o.length===0){this.drawNoDataMessage(e,s);return}const l=o.filter(f=>f.value>0),a=l.reduce((f,n)=>f+n.value,0);if(a<=0||l.length===0){this.drawNoDataMessage(e,s);return}const{centerX:r,centerY:i,radius:t}=this.getCircleDimensions(s),h=t*.6;this.drawSlices(e,l,a,r,i,t,h),this.drawLabels(e,l,a,r,i,t),this.drawCenterInfo(e,a,r,i,h)}drawSlices(e,o,s,l,a,r,i){let t=-Math.PI/2;o.forEach((h,f)=>{if(!h.value||h.value<=0)return;const n=h.value/s*(Math.PI*2),d=t+n;e.beginPath(),e.arc(l,a,r,t,d),e.arc(l,a,i,d,t,!0),e.closePath();const u=h.color||this.colors[f%this.colors.length],g=e.createRadialGradient(l,a,i,l,a,r);g.addColorStop(0,this.colorWithOpacity(u,.8)),g.addColorStop(1,u),e.fillStyle=g,e.fill(),e.strokeStyle="#ffffff",e.lineWidth=2,e.stroke(),t=d})}drawLabels(e,o,s,l,a,r){let i=-Math.PI/2;o.forEach((t,h)=>{if(!t.value||t.value<=0)return;const f=t.value/s*(Math.PI*2),n=i+f/2,d=r*1.2,u=l+Math.cos(n)*d,g=a+Math.sin(n)*d;e.beginPath(),e.moveTo(l+Math.cos(n)*r,a+Math.sin(n)*r),e.lineTo(u,g),e.strokeStyle="#9ca3af",e.lineWidth=1,e.stroke(),e.fillStyle="#374151",e.textAlign=n<Math.PI?"left":"right",e.textBaseline="middle";const S=(t.value/s*100).toFixed(1);e.fillText(`${t.label} (${S}%)`,u,g),i+=f})}drawCenterInfo(e,o,s,l,a){e.beginPath(),e.arc(s,l,a-2,0,Math.PI*2),e.fillStyle="#ffffff",e.fill(),e.strokeStyle="#e5e7eb",e.lineWidth=2,e.stroke(),e.textAlign="center",e.textBaseline="middle",e.fillStyle="#374151",e.font="bold 16px Inter, system-ui, sans-serif",e.fillText("Total",s,l-10),e.fillText(o.toString(),s,l+10)}}exports.DoughnutChartRenderer=v;