feat: add storybook for missing chart and fix broken treemap

packages/superset-ui-demo/storybook/stories/plugins/plugin-chart-echarts/Gauge/Stories.tsx

@@ -0,0 +1,32 @@
+import React from 'react';
+import { SuperChart, getChartTransformPropsRegistry } from '@superset-ui/core';
+import { withKnobs } from '@storybook/addon-knobs';
+import { EchartsGaugeChartPlugin } from '@superset-ui/plugin-chart-echarts';
+import transformProps from '@superset-ui/plugin-chart-echarts/lib/Gauge/transformProps';
+import { withResizableChartDemo } from '../../../../shared/components/ResizableChartDemo';
+import { speed } from './data';
+
+new EchartsGaugeChartPlugin().configure({ key: 'echarts-gauge' }).register();
+
+getChartTransformPropsRegistry().registerValue('echarts-gauge', transformProps);
+
+export default {
+  title: 'Chart Plugins/plugin-chart-echarts/Gauge',
+  decorators: [withKnobs, withResizableChartDemo],
+};
+
+export const Gauge = ({ width, height }) => {
+  return (
+    <SuperChart
+      chartType="echarts-gauge"
+      width={width}
+      height={height}
+      queriesData={[{ data: speed }]}
+      formData={{
+        columns: [],
+        groupby: ['name'],
+        metric: 'value',
+      }}
+    />
+  );
+};

packages/superset-ui-demo/storybook/stories/plugins/plugin-chart-echarts/Gauge/data.ts

@@ -0,0 +1,6 @@
+export const speed = [
+  {
+    name: 'km/h',
+    value: 70,
+  },
+];

packages/superset-ui-demo/storybook/stories/plugins/plugin-chart-echarts/Graph/Stories.tsx

@@ -0,0 +1,34 @@
+import React from 'react';
+import { SuperChart, getChartTransformPropsRegistry } from '@superset-ui/core';
+import { withKnobs } from '@storybook/addon-knobs';
+import { EchartsGraphChartPlugin } from '@superset-ui/plugin-chart-echarts';
+import transformProps from '@superset-ui/plugin-chart-echarts/lib/Graph/transformProps';
+import { basic } from './data';
+import { withResizableChartDemo } from '../../../../shared/components/ResizableChartDemo';
+
+new EchartsGraphChartPlugin().configure({ key: 'echarts-graph' }).register();
+
+getChartTransformPropsRegistry().registerValue('echarts-graph', transformProps);
+
+export default {
+  title: 'Chart Plugins/plugin-chart-echarts/Graph',
+  decorators: [withKnobs, withResizableChartDemo],
+};
+
+export const Graph = ({ width, height }) => {
+  return (
+    <SuperChart
+      chartType="echarts-graph"
+      width={width}
+      height={height}
+      queriesData={[{ data: basic }]}
+      formData={{
+        source: 'source',
+        target: 'target',
+        sourceCategory: 'sourceCategory',
+        targetCategory: 'targetCategory',
+        metric: 'value',
+      }}
+    />
+  );
+};

packages/superset-ui-demo/storybook/stories/plugins/plugin-chart-echarts/Graph/data.ts

@@ -0,0 +1,310 @@
+export const basic = [
+  {
+    source: '05/18/21 Live Demo',
+    target: '05/04/21 Live Demo',
+    value: 100,
+    sourceCategory: 'Live Demo',
+    targetCategory: 'Live Demo',
+  },
+  {
+    source: '05/04/21 Live Demo',
+    target: '04/20/21 Live Demo',
+    value: 110,
+    category: 'Live Demo',
+    targetCategory: 'Live Demo',
+  },
+  {
+    source: '05/04/21 Live Demo',
+    target: '04/13/21 Live Demo',
+    value: 40,
+    category: 'Live Demo',
+    targetCategory: 'Live Demo',
+  },
+  {
+    source: '05/04/21 Live Demo',
+    target: '04/06/21 Live Demo',
+    value: 30,
+    category: 'Live Demo',
+    targetCategory: 'Live Demo',
+  },
+  {
+    source: '05/04/21 Live Demo',
+    target: '09/29/21 Live Demo',
+    value: 25,
+    category: 'Live Demo',
+    targetCategory: 'Live Demo',
+  },
+  {
+    source: '05/04/21 Live Demo',
+    target: '06/01/21 Live Demo',
+    value: 43,
+    category: 'Live Demo',
+    targetCategory: 'Live Demo',
+  },
+  {
+    source: '04/20/21 Live Demo',
+    target: '04/13/21 Live Demo',
+    value: 50,
+    category: 'Live Demo',
+    targetCategory: 'Live Demo',
+  },
+  {
+    source: '04/20/21 Live Demo',
+    target: '03/02/21 Meetup',
+    value: 40,
+    category: 'Live Demo',
+    targetCategory: 'Meetup',
+  },
+  {
+    source: '04/20/21 Live Demo',
+    target: '06/01/21 Live Demo',
+    value: 58,
+    category: 'Live Demo',
+    targetCategory: 'Live Demo',
+  },
+  {
+    source: '04/20/21 Live Demo',
+    target: '03/25/21 Meetup',
+    value: 38,
+    category: 'Live Demo',
+    targetCategory: 'Meetup',
+  },
+  {
+    source: '04/20/21 Live Demo',
+    target: '01/28/21 Meetup',
+    value: 34,
+    category: 'Live Demo',
+    targetCategory: 'Meetup',
+  },
+  {
+    source: '04/13/21 Live Demo',
+    target: '04/06/21 Live Demo',
+    value: 34,
+    category: 'Live Demo',
+    targetCategory: 'Live Demo',
+  },
+  {
+    source: '04/13/21 Live Demo',
+    target: '09/29/21 Live Demo',
+    value: 56,
+    category: 'Live Demo',
+    targetCategory: 'Live Demo',
+  },
+  {
+    source: '04/06/21 Live Demo',
+    target: '09/29/21 Live Demo',
+    value: 77,
+    category: 'Live Demo',
+    targetCategory: 'Live Demo',
+  },
+  {
+    source: '04/13/21 Live Demo',
+    target: '03/02/21 Meetup',
+    value: 36,
+    category: 'Live Demo',
+    targetCategory: 'Meetup',
+  },
+  {
+    source: '04/13/21 Live Demo',
+    target: '06/08/21 Live Demo',
+    value: 77,
+    category: 'Live Demo',
+    targetCategory: 'Live Demo',
+  },
+  {
+    source: '09/29/21 Live Demo',
+    target: '06/01/21 Live Demo',
+    value: 44,
+    category: 'Live Demo',
+    targetCategory: 'Live Demo',
+  },
+  {
+    source: '09/29/21 Live Demo',
+    target: '06/08/21 Live Demo',
+    value: 30,
+    category: 'Live Demo',
+    targetCategory: 'Live Demo',
+  },
+  {
+    source: '06/01/21 Live Demo',
+    target: '03/02/21 Meetup',
+    value: 67,
+    category: 'Live Demo',
+    targetCategory: 'Meetup',
+  },
+  {
+    source: '06/01/21 Live Demo',
+    target: '03/25/21 Meetup',
+    value: 30,
+    category: 'Live Demo',
+    targetCategory: 'Meetup',
+  },
+  {
+    source: '06/01/21 Live Demo',
+    target: '05/11/21 Meetup',
+    value: 52,
+    category: 'Live Demo',
+    targetCategory: 'Meetup',
+  },
+  {
+    source: '06/01/21 Live Demo',
+    target: '06/08/21 Live Demo',
+    value: 43,
+    category: 'Live Demo',
+    targetCategory: 'Live Demo',
+  },
+  {
+    source: '06/01/21 Live Demo',
+    target: '01/28/21 Meetup',
+    value: 45,
+    category: 'Live Demo',
+    targetCategory: 'Meetup',
+  },
+  {
+    source: '06/01/21 Live Demo',
+    target: '05/04/21 Live Demo',
+    value: 42,
+    category: 'Live Demo',
+    targetCategory: 'Live Demo',
+  },
+  {
+    source: '06/01/21 Live Demo',
+    target: '03/25/21 Meetup',
+    value: 32,
+    category: 'Live Demo',
+    targetCategory: 'Meetup',
+  },
+  {
+    source: '03/02/21 Meetup',
+    target: '03/25/21 Meetup',
+    value: 23,
+    category: 'Meetup',
+    targetCategory: 'Meetup',
+  },
+  {
+    source: '03/02/21 Meetup',
+    target: '05/11/21 Meetup',
+    value: 43,
+    category: 'Meetup',
+    targetCategory: 'Meetup',
+  },
+  {
+    source: '03/02/21 Meetup',
+    target: '01/28/21 Meetup',
+    value: 33,
+    category: 'Meetup',
+    targetCategory: 'Meetup',
+  },
+  {
+    source: '03/02/21 Meetup',
+    target: '05/04/21 Live Demo',
+    value: 53,
+    category: 'Meetup',
+    targetCategory: 'Live Demo',
+  },
+  {
+    source: '03/02/21 Meetup',
+    target: '03/25/21 Meetup',
+    value: 55,
+    category: 'Meetup',
+    targetCategory: 'Meetup',
+  },
+  {
+    source: '03/25/21 Meetup',
+    target: '05/11/21 Meetup',
+    value: 33,
+    category: 'Meetup',
+    targetCategory: 'Meetup',
+  },
+  {
+    source: '03/25/21 Meetup',
+    target: '06/08/21 Live Demo',
+    value: 73,
+    category: 'Meetup',
+    targetCategory: 'Live Demo',
+  },
+  {
+    source: '03/25/21 Meetup',
+    target: '01/28/21 Meetup',
+    value: 63,
+    category: 'Meetup',
+    targetCategory: 'Meetup',
+  },
+  {
+    source: '03/25/21 Meetup',
+    target: '05/04/21 Live Demo',
+    value: 52,
+    category: 'Meetup',
+    targetCategory: 'Live Demo',
+  },
+  {
+    source: '03/25/21 Meetup',
+    target: '03/25/21 Meetup',
+    value: 51,
+    category: 'Meetup',
+    targetCategory: 'Meetup',
+  },
+  {
+    source: '05/11/21 Meetup',
+    target: '06/08/21 Live Demo',
+    value: 35,
+    category: 'Meetup',
+    targetCategory: 'Live Demo',
+  },
+  {
+    source: '05/11/21 Meetup',
+    target: '05/04/21 Live Demo',
+    value: 75,
+    category: 'Meetup',
+    targetCategory: 'Live Demo',
+  },
+  {
+    source: '05/11/21 Meetup',
+    target: '01/28/21 Meetup',
+    value: 65,
+    category: 'Meetup',
+    targetCategory: 'Meetup',
+  },
+  {
+    source: '06/08/21 Live Demo',
+    target: '01/28/21 Meetup',
+    value: 36,
+    category: 'Live Demo',
+    targetCategory: 'Meetup',
+  },
+  {
+    source: '06/08/21 Live Demo',
+    target: '05/04/21 Live Demo',
+    value: 46,
+    category: 'Live Demo',
+    targetCategory: 'Live Demo',
+  },
+  {
+    source: '06/08/21 Live Demo',
+    target: '03/25/21 Meetup',
+    value: 26,
+    category: 'Live Demo',
+    targetCategory: 'Meetup',
+  },
+  {
+    source: '03/25/21 Meetup',
+    target: '05/04/21 Live Demo',
+    value: 78,
+    category: 'Meetup',
+    targetCategory: 'Live Demo',
+  },
+  {
+    source: '03/25/21 Meetup',
+    target: '03/25/21 Meetup',
+    value: 45,
+    category: 'Meetup',
+    targetCategory: 'Meetup',
+  },
+  {
+    source: '05/18/21 Live Demo',
+    target: '03/25/21 Meetup',
+    value: 65,
+    category: 'Live Demo',
+    targetCategory: 'Meetup',
+  },
+];