UNPKG

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

s00d.github.io/on-codemerge/

s00d/on-codemerge

3 lines (2 loc) • 4.23 kB
1
2
3
/*! 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 */ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const y=require("./BaseChartRenderer.cjs"),M=require("../utils/validation.cjs");class H extends y.BaseChartRenderer{render(t,e,a){if(!M.validateChartData(e)){this.drawNoDataMessage(t,a);return}const l=Array.isArray(e)&&"data"in e[0]?e:[{name:"",data:e}],o=l[0].data.map(r=>r.label||""),f=a.mode||"default",v=a.orientation||"vertical";let n=1;f==="stacked"?n=Math.max(...o.map((r,s)=>l.reduce((h,d)=>{var m;return h+(((m=d.data[s])==null?void 0:m.value)||0)},0))):n=Math.max(...l.flatMap(r=>r.data.map(s=>s.value||0)),1),this.drawBackground(t,a),this.drawTitle(t,a),this.drawGrid(t,a,n,!0,o,"bar"),v==="vertical"?f==="stacked"?this.drawStackedBars(t,l,a,n,this.getColors(a)):f==="grouped"?this.drawGroupedBars(t,l,a,n,this.getColors(a)):this.drawSingleBars(t,l,a,n,this.getColors(a)):f==="stacked"?this.drawHorizontalStackedBars(t,l,a,n,this.getColors(a)):f==="grouped"?this.drawHorizontalGroupedBars(t,l,a,n,this.getColors(a)):this.drawHorizontalBars(t,l,a,n,this.getColors(a)),this.drawAxisLabels(t,a),this.drawLegend(t,l,a)}drawSingleBars(t,e,a,u,l){const{padding:o,width:f,height:v}=this.getDimensions(a),n=e[0].data,r=n.length,s=f,h=Math.max(20,s/Math.max(1,r)/1.5),d=s/r,m=v/u;n.forEach((g,b)=>{const i=g.value||0,S=o+d*b+(d-h)/2,c=i*m,C=a.height-o-c,B=g.color||l[b%l.length];t.fillStyle="rgba(0,0,0,0.1)",t.fillRect(S+2,C+2,h,c);const w=t.createLinearGradient(S,C,S,C+c);w.addColorStop(0,B),w.addColorStop(1,this.colorWithOpacity(B,.7)),t.fillStyle=w,this.roundRect(t,S,C,h,c,4),t.fill(),t.fillStyle=this.getTextColor(a),t.textAlign="center",t.font="12px Inter, system-ui, sans-serif",t.fillText(i.toString(),S+h/2,C-8)})}drawStackedBars(t,e,a,u,l){var h;const{padding:o,width:f,height:v}=this.getDimensions(a),n=e[0].data.length,r=f/n,s=Math.max(20,r/1.5);for(let d=0;d<n;d++){let m=a.height-o;for(let g=0;g<e.length;g++){const i=(((h=e[g].data[d])==null?void 0:h.value)||0)*v/u;m-=i;const S=o+r*d+(r-s)/2,c=e[g].color||l[g%l.length];t.fillStyle=c,this.roundRect(t,S,m,s,i,4),t.fill()}}}drawGroupedBars(t,e,a,u,l){var g;const{padding:o,width:f,height:v}=this.getDimensions(a),n=e[0].data.length,r=e.length,s=f/n,h=Math.max(20,s/1.2),d=h/r,m=v/u;for(let b=0;b<n;b++)for(let i=0;i<r;i++){const c=(((g=e[i].data[b])==null?void 0:g.value)||0)*m,C=o+s*b+(s-h)/2+i*d,B=a.height-o-c,w=e[i].color||l[i%l.length];t.fillStyle=w,this.roundRect(t,C,B,d,c,4),t.fill()}}drawHorizontalBars(t,e,a,u,l){const{padding:o,width:f,height:v}=this.getDimensions(a),n=e[0].data,r=n.length,s=v,h=Math.max(20,s/Math.max(1,r)/1.5),d=s/r,m=f/u;n.forEach((g,b)=>{const i=g.value||0,S=o+d*b+(d-h)/2,c=i*m,C=o,B=g.color||l[b%l.length];t.fillStyle="rgba(0,0,0,0.1)",t.fillRect(C+2,S+2,c,h);const w=t.createLinearGradient(C,S,C+c,S);w.addColorStop(0,B),w.addColorStop(1,this.colorWithOpacity(B,.7)),t.fillStyle=w,this.roundRect(t,C,S,c,h,4),t.fill(),t.fillStyle=this.getTextColor(a),t.textAlign="left",t.font="12px Inter, system-ui, sans-serif",t.fillText(i.toString(),C+c+8,S+h/2)})}drawHorizontalStackedBars(t,e,a,u,l){var h;const{padding:o,width:f,height:v}=this.getDimensions(a),n=e[0].data.length,r=v/n,s=Math.max(20,r/1.5);for(let d=0;d<n;d++){let m=o;for(let g=0;g<e.length;g++){const i=(((h=e[g].data[d])==null?void 0:h.value)||0)*f/u,S=o+r*d+(r-s)/2,c=e[g].color||l[g%l.length];t.fillStyle=c,this.roundRect(t,m,S,i,s,4),t.fill(),m+=i}}}drawHorizontalGroupedBars(t,e,a,u,l){var g;const{padding:o,width:f,height:v}=this.getDimensions(a),n=e[0].data.length,r=e.length,s=v/n,h=Math.max(20,s/1.2),d=h/r,m=f/u;for(let b=0;b<n;b++)for(let i=0;i<r;i++){const c=(((g=e[i].data[b])==null?void 0:g.value)||0)*m,C=o+s*b+(s-h)/2+i*d,B=o,w=e[i].color||l[i%l.length];t.fillStyle=w,this.roundRect(t,B,C,c,d,4),t.fill()}}roundRect(t,e,a,u,l,o){t.beginPath(),t.moveTo(e+o,a),t.lineTo(e+u-o,a),t.quadraticCurveTo(e+u,a,e+u,a+o),t.lineTo(e+u,a+l),t.lineTo(e,a+l),t.lineTo(e,a+o),t.quadraticCurveTo(e,a,e+o,a),t.closePath()}}exports.BarChartRenderer=H;