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
3 lines (2 loc) • 4.53 kB
JavaScript
/*! on-codemerge v1.3.1 @author Pavel Kuzmin @license MIT @homepage https://s00d.github.io/on-codemerge/ @repository git+https://github.com/s00d/on-codemerge.git Copyright (c) 2026 Pavel Kuzmin - Built on 2026-07-02T13:39:17.947Z */
;Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const T=require("./BaseChartRenderer.cjs"),u=require("../utils/validation.cjs");class k extends T.BaseChartRenderer{render(e,s,t){if(!u.validateChartData(s)){this.drawNoDataMessage(e,t);return}const r=Array.isArray(s)&&"data"in s[0]?s:[{name:"",data:s}],a=r[0].data.map(d=>d.label||""),g=this.getColors(t),h=t.mode||"default",o=t.orientation||"vertical";let l=1;h==="stacked"?l=Math.max(...a.map((d,n)=>r.reduce((c,y)=>{var f;return c+(((f=y.data[n])==null?void 0:f.value)||0)},0))):l=Math.max(...r.flatMap(d=>d.data.map(n=>n.value||0)),1),this.drawBackground(e,t),this.drawTitle(e,t),this.drawGrid(e,t,l,!0,a,"area"),o==="vertical"?h==="stacked"?this.drawStackedArea(e,r,t,l,g):this.drawNormalArea(e,r,t,l,g):h==="stacked"?this.drawHorizontalStackedArea(e,r,t,l,g):this.drawHorizontalArea(e,r,t,l,g),this.drawAxisLabels(e,t),this.drawLegend(e,r,t)}drawNormalArea(e,s,t,v,r){const{padding:a,width:g,height:h}=this.getDimensions(t),o=h/(v*1.1);[...s].reverse().forEach((l,d)=>{const n=l.color||r[d%r.length];e.beginPath(),e.moveTo(a,t.height-a),l.data.forEach((y,f)=>{const m=a+g/(l.data.length-1)*f,i=t.height-a-(y.value||0)*o;f===0&&e.moveTo(m,t.height-a),e.lineTo(m,i)}),e.lineTo(t.width-a,t.height-a),e.closePath();const c=e.createLinearGradient(0,a,0,t.height-a);c.addColorStop(0,this.colorWithOpacity(n,.3)),c.addColorStop(1,this.colorWithOpacity(n,.05)),e.fillStyle=c,e.fill(),this.drawLine(e,l,t,o,n),this.drawPoints(e,l,t,o,n)})}drawStackedArea(e,s,t,v,r){const{padding:a,width:g,height:h}=this.getDimensions(t),o=s[0].data.length,l=h/(v*1.1),d=new Array(o).fill(0);[...s].reverse().forEach((n,c)=>{var m;const y=n.color||r[c%r.length];e.beginPath();for(let i=0;i<o;i++){const w=a+g/(o-1)*i;d[i]+=((m=n.data[i])==null?void 0:m.value)||0;const S=t.height-a-d[i]*l;i===0&&e.moveTo(w,t.height-a),e.lineTo(w,S)}e.lineTo(t.width-a,t.height-a),e.closePath();const f=e.createLinearGradient(0,a,0,t.height-a);f.addColorStop(0,this.colorWithOpacity(y,.3)),f.addColorStop(1,this.colorWithOpacity(y,.05)),e.fillStyle=f,e.fill(),e.beginPath();for(let i=0;i<o;i++){const w=a+g/(o-1)*i,S=t.height-a-d[i]*l;i===0?e.moveTo(w,S):e.lineTo(w,S)}e.strokeStyle=y,e.lineWidth=2,e.stroke()})}drawHorizontalArea(e,s,t,v,r){const{padding:a,width:g,height:h}=this.getDimensions(t),o=g/(v*1.1);[...s].reverse().forEach((l,d)=>{const n=l.color||r[d%r.length];e.beginPath(),e.moveTo(a,h-a),l.data.forEach((y,f)=>{const m=a+h/(l.data.length-1)*f,i=a+(y.value||0)*o;f===0&&e.moveTo(a,m),e.lineTo(i,m)}),e.lineTo(a,h-a),e.closePath();const c=e.createLinearGradient(a,0,g-a,0);c.addColorStop(0,this.colorWithOpacity(n,.3)),c.addColorStop(1,this.colorWithOpacity(n,.05)),e.fillStyle=c,e.fill(),e.beginPath(),l.data.forEach((y,f)=>{const m=a+h/(l.data.length-1)*f,i=a+(y.value||0)*o;f===0?e.moveTo(i,m):e.lineTo(i,m)}),e.strokeStyle=n,e.lineWidth=2,e.stroke()})}drawHorizontalStackedArea(e,s,t,v,r){const{padding:a,width:g,height:h}=this.getDimensions(t),o=s[0].data.length,l=g/(v*1.1),d=new Array(o).fill(0);[...s].reverse().forEach((n,c)=>{var m;const y=n.color||r[c%r.length];e.beginPath();for(let i=0;i<o;i++){const w=a+h/(o-1)*i;d[i]+=((m=n.data[i])==null?void 0:m.value)||0;const S=a+d[i]*l;i===0&&e.moveTo(a,w),e.lineTo(S,w)}e.lineTo(a,h-a),e.closePath();const f=e.createLinearGradient(a,0,g-a,0);f.addColorStop(0,this.colorWithOpacity(y,.3)),f.addColorStop(1,this.colorWithOpacity(y,.05)),e.fillStyle=f,e.fill(),e.beginPath();for(let i=0;i<o;i++){const w=a+h/(o-1)*i,S=a+d[i]*l;i===0?e.moveTo(S,w):e.lineTo(S,w)}e.strokeStyle=y,e.lineWidth=2,e.stroke()})}drawLine(e,s,t,v,r){const{padding:a,width:g}=this.getDimensions(t),h=s.data;e.beginPath(),h.forEach((o,l)=>{const d=a+g/(h.length-1)*l,n=t.height-a-(o.value||0)*v;l===0?e.moveTo(d,n):e.lineTo(d,n)}),e.strokeStyle=r,e.lineWidth=2,e.stroke()}drawPoints(e,s,t,v,r){const{padding:a,width:g}=this.getDimensions(t),h=s.data;h.forEach((o,l)=>{var c;const d=a+g/(h.length-1)*l,n=t.height-a-(o.value||0)*v;e.beginPath(),e.arc(d,n,4,0,Math.PI*2),e.fillStyle="#fff",e.fill(),e.strokeStyle=r,e.lineWidth=2,e.stroke(),e.fillStyle=this.getTextColor(t),e.textAlign="center",e.textBaseline="bottom",e.fillText(((c=o.value)==null?void 0:c.toString())||"0",d,n-8)})}}exports.AreaChartRenderer=k;