Merge branch 'render-start-event' into 'main'

new renderStart event

See merge request chartwerk/core!15

dist/VueChartwerkPodMixin.d.ts

@@ -41,6 +41,7 @@ declare const _default: {
         panning(range: any): void;
         contextMenu(evt: any): void;
         sharedCrosshairMove(event: any): void;
+        renderStart(): void;
         renderEnd(): void;
     };
 };

dist/types.d.ts

@@ -33,6 +33,7 @@ export declare type Options = {
         onLegendLabelClick?: (idx: number) => void;
         contextMenu?: (evt: any) => void;
         sharedCrosshairMove?: (event: any) => void;
+        renderStart?: () => void;
         renderEnd?: () => void;
     };
     axis?: {

src/VueChartwerkPodMixin.ts

@@ -78,6 +78,9 @@ export default {
       if(has(this.$listeners, 'sharedCrosshairMove')) {
         this.options.eventsCallbacks.sharedCrosshairMove = this.sharedCrosshairMove.bind(this);
       }
+      if(has(this.$listeners, 'renderStart')) {
+        this.options.eventsCallbacks.renderStart = this.renderStart.bind(this);
+      }
       if(has(this.$listeners, 'renderEnd')) {
         this.options.eventsCallbacks.renderEnd = this.renderEnd.bind(this);
       }
@@ -109,6 +112,9 @@ export default {
     sharedCrosshairMove(event) {
       this.$emit('sharedCrosshairMove', event);
     },
+    renderStart() {
+      this.$emit('renderStart');
+    },
     renderEnd() {
       this.$emit('renderEnd');
     },

src/index.ts

@@ -178,6 +178,10 @@ abstract class ChartwerkPod<T extends TimeSerie, O extends Options> {
   }
 
   public render(): void {
+    if(has(this.options.eventsCallbacks, 'renderStart')) {
+      this.options.eventsCallbacks.renderStart();
+    }
+
     this.renderClipPath();
     this.addEvents();
 
@@ -256,7 +260,7 @@ abstract class ChartwerkPod<T extends TimeSerie, O extends Options> {
       xScale: this.state.xScale,
       yScale: this.state.yScale,
     }
-  
+
     this.grid = new Grid(this.d3, this.chartContainer, svgElParams, this.options.grid);
   }
 
@@ -973,7 +977,7 @@ abstract class ChartwerkPod<T extends TimeSerie, O extends Options> {
           console.warn(`Value formatter for axis is not defined. Path options.axis.{?}.valueFormatter`);
           return (d) => d;
         }
-        return (d, i) => { 
+        return (d, i) => {
           if(axisOptions.colorFormatter !== undefined) {
             this.yAxisTicksColors.push(axisOptions.colorFormatter(d, i))
           }

src/types.ts

@@ -25,6 +25,7 @@ export type Options = {
     onLegendLabelClick?: (idx: number) => void,
     contextMenu?: (evt: any) => void, // the same name as in d3.events
     sharedCrosshairMove?: (event: any) => void,
+    renderStart?: () => void,
     renderEnd?: () => void,
   };
   axis?: {
@@ -183,4 +184,4 @@ export type SvgElParams = {
   width: number,
   xScale: d3.ScaleLinear<number, number>,
   yScale: d3.ScaleLinear<number, number>,
-}
+}