| ## @superset-ui/plugin-chart-<%= packageName %> |
| |
| <%if (addBadges) { %>[![Version](https://img.shields.io/npm/v/@superset-ui/plugin-chart-<%= packageName %>.svg?style=flat-square)](https://www.npmjs.com/package/@superset-ui/plugin-chart-<%= packageName %>)<% } %> |
| |
| This plugin provides <%= description %> for Superset. |
| |
| ### Usage |
| |
| Configure `key`, which can be any `string`, and register the plugin. This `key` will be used to lookup this chart throughout the app. |
| |
| ```js |
| import <%= packageLabel %>ChartPlugin from '@superset-ui/plugin-chart-<%= packageName %>'; |
| |
| new <%= packageLabel %>ChartPlugin() |
| .configure({ key: '<%= packageName %>' }) |
| .register(); |
| ``` |
| |
| Then use it via `SuperChart`. See [storybook](https://apache-superset.github.io/superset-ui/?selectedKind=plugin-chart-<%= packageName %>) for more details. |
| |
| ```js |
| <SuperChart |
| chartType="<%= packageName %>" |
| width={600} |
| height={600} |
| formData={...} |
| queriesData={[{ |
| data: {...}, |
| }]} |
| /> |
| ``` |
| |
| ### File structure generated |
| |
| ``` |
| ├── package.json |
| ├── README.md |
| ├── tsconfig.json |
| ├── src |
| │ ├── <%= packageLabel %>.tsx |
| │ ├── images |
| │ │ └── thumbnail.png |
| │ ├── index.ts |
| │ ├── plugin |
| │ │ ├── buildQuery.ts |
| │ │ ├── controlPanel.ts |
| │ │ ├── index.ts |
| │ │ └── transformProps.ts |
| │ └── types.ts |
| ├── test |
| │ └── index.test.ts |
| └── types |
| └── external.d.ts |
| ``` |