fix: cleanup example prop default values (#173)

SVG renderer is not ready yet, this commit will set the rendering to `canvas` as default.
The BasicSeries component and all the code that use `basic` series type is removed.

Author: markov00

src/components/chart.tsx

@@ -14,14 +14,17 @@ import { ReactiveChart as SVGChart } from './svg/reactive_chart';
 import { Tooltips } from './tooltips';
 
 interface ChartProps {
-  renderer: 'svg' | 'canvas' | 'canvas_old';
+  /** The type of rendered
+   * @default 'canvas'
+   */
+  renderer: 'svg' | 'canvas';
   size?: [number, number];
   className?: string;
 }
 
 export class Chart extends React.Component<ChartProps> {
-  static defaultProps: Pick<ChartProps, 'renderer'> = {
-    renderer: 'svg',
+  static defaultProps: ChartProps = {
+    renderer: 'canvas',
   };
   private chartSpecStore: ChartStore;
   constructor(props: any) {

src/lib/series/specs.ts

@@ -42,7 +42,7 @@ export interface SeriesSpec {
   /** An array of data */
   data: Datum[];
   /** The type of series you are looking to render */
-  seriesType: 'bar' | 'line' | 'area' | 'basic';
+  seriesType: 'bar' | 'line' | 'area';
   /** Custom colors for series */
   customSeriesColors?: CustomSeriesColorsMap;
   /** If the series should appear in the legend
@@ -88,7 +88,10 @@ export interface SeriesScales {
    * @default ScaleType.Linear
    */
   yScaleType: ScaleContinuousType;
-  /** if true, the min y value is set to the minimum domain value, 0 otherwise */
+  /**
+   * if true, the min y value is set to the minimum domain value, 0 otherwise
+   * @default false
+   */
   yScaleToDataExtent: boolean;
 }
 

src/specs/basic_series.tsx

@@ -1,5 +1,4 @@
 export { Axis } from './axis';
-export { BasicSeries } from './basic_series';
 export { LineAnnotation } from './line_annotation';
 export { LineSeries } from './line_series';
 export { BarSeries } from './bar_series';

src/specs/index.ts

@@ -11,7 +11,6 @@ import {
   renderArea,
   renderBars,
   renderLine,
-  renderPoints,
 } from '../lib/series/rendering';
 import { computeXScale, computeYScales, countBarsInCluster } from '../lib/series/scales';
 import {
@@ -309,7 +308,7 @@ export function renderGeometries(
   const bars: BarGeometry[] = [];
   const areas: AreaGeometry[] = [];
   const lines: LineGeometry[] = [];
-  let pointGeometriesIndex: Map<any, IndexedGeometry[]> = new Map();
+  const pointGeometriesIndex: Map<any, IndexedGeometry[]> = new Map();
   let barGeometriesIndex: Map<any, IndexedGeometry[]> = new Map();
   let lineGeometriesIndex: Map<any, IndexedGeometry[]> = new Map();
   let areaGeometriesIndex: Map<any, IndexedGeometry[]> = new Map();
@@ -329,26 +328,6 @@ export function renderGeometries(
     }
     const color = seriesColorsMap.get(ds.seriesColorKey) || defaultColor;
     switch (spec.seriesType) {
-      case 'basic':
-        const pointShift = clusteredCount > 0 ? clusteredCount : 1;
-
-        const renderedPoints = renderPoints(
-          (xScale.bandwidth * pointShift) / 2,
-          ds.data,
-          xScale,
-          yScale,
-          color,
-          ds.specId,
-          Boolean(spec.y0Accessors),
-          ds.key,
-        );
-        points.push(...renderedPoints.pointGeometries);
-        pointGeometriesIndex = mergeGeometriesIndexes(
-          pointGeometriesIndex,
-          renderedPoints.indexedGeometries,
-        );
-        geometriesCounts.points += renderedPoints.pointGeometries.length;
-        break;
       case 'bar':
         const shift = isStacked ? indexOffset : indexOffset + i;
         const barSeriesStyle = spec.barSeriesStyle;

src/state/utils.ts

@@ -69,7 +69,7 @@ storiesOf('Annotations', module)
     const axisPosition = isBottom ? Position.Bottom : Position.Top;
 
     return (
-      <Chart renderer="canvas" className={'story-chart'}>
+      <Chart className={'story-chart'}>
         <Settings debug={boolean('debug', false)} rotation={chartRotation} />
         <LineAnnotation
           annotationId={getAnnotationId('anno_1')}
@@ -87,7 +87,6 @@ storiesOf('Annotations', module)
           xAccessor="x"
           yAccessors={['y']}
           data={[{ x: 0, y: 2 }, { x: 1, y: 7 }, { x: 3, y: 6 }]}
-          yScaleToDataExtent={false}
         />
       </Chart>
     );
@@ -107,7 +106,7 @@ storiesOf('Annotations', module)
     );
 
     return (
-      <Chart renderer="canvas" className={'story-chart'}>
+      <Chart className={'story-chart'}>
         <Settings debug={boolean('debug', false)} rotation={chartRotation} />
         <LineAnnotation
           annotationId={getAnnotationId('anno_1')}
@@ -129,7 +128,6 @@ storiesOf('Annotations', module)
           xAccessor="x"
           yAccessors={['y']}
           data={[{ x: 'a', y: 2 }, { x: 'b', y: 7 }, { x: 'c', y: 3 }, { x: 'd', y: 6 }]}
-          yScaleToDataExtent={false}
         />
       </Chart>
     );
@@ -154,7 +152,7 @@ storiesOf('Annotations', module)
     const axisPosition = isLeft ? Position.Left : Position.Right;
 
     return (
-      <Chart renderer="canvas" className={'story-chart'}>
+      <Chart className={'story-chart'}>
         <Settings debug={boolean('debug', false)} rotation={chartRotation} />
         <LineAnnotation
           annotationId={getAnnotationId('anno_')}
@@ -171,7 +169,6 @@ storiesOf('Annotations', module)
           xAccessor="x"
           yAccessors={['y']}
           data={[{ x: 0, y: 2 }, { x: 1, y: 7 }, { x: 2, y: 3 }, { x: 3, y: 6 }]}
-          yScaleToDataExtent={false}
         />
       </Chart>
     );
@@ -197,7 +194,7 @@ storiesOf('Annotations', module)
     );
 
     return (
-      <Chart renderer="canvas" className={'story-chart'}>
+      <Chart className={'story-chart'}>
         <Settings debug={boolean('debug', false)} rotation={chartRotation} />
         <LineAnnotation
           annotationId={getAnnotationId('anno_1')}
@@ -219,7 +216,6 @@ storiesOf('Annotations', module)
           xAccessor={0}
           yAccessors={[1]}
           data={KIBANA_METRICS.metrics.kibana_os_load[0].data.slice(0, 20)}
-          yScaleToDataExtent={false}
         />
       </Chart>
     );
@@ -263,7 +259,7 @@ storiesOf('Annotations', module)
     const hideTooltips = boolean('annotation tooltips hidden', false);
 
     return (
-      <Chart renderer="canvas" className={'story-chart'}>
+      <Chart className={'story-chart'}>
         <Settings debug={boolean('debug', false)} rotation={chartRotation} />
         <LineAnnotation
           annotationId={getAnnotationId('anno_1')}
@@ -283,7 +279,6 @@ storiesOf('Annotations', module)
           xAccessor="x"
           yAccessors={['y']}
           data={[{ x: 0, y: 2 }, { x: 1, y: 7 }, { x: 3, y: 6 }]}
-          yScaleToDataExtent={false}
         />
       </Chart>
     );