diff --git a/build/webpack.demo.conf.js b/build/webpack.demo.conf.js
new file mode 100755
index 0000000..5e9d844
--- /dev/null
+++ b/build/webpack.demo.conf.js
@@ -0,0 +1,40 @@
+const path = require('path');
+
+function resolve(dir) {
+ return path.join(__dirname, '..', dir)
+}
+
+module.exports = {
+ context: resolve('demo'),
+ entry: './demo_pod.ts',
+ plugins: [],
+ devtool: 'inline-source-map',
+ watch: true,
+ mode: 'development',
+ module: {
+ rules: [
+ {
+ test: /\.ts$/,
+ use: 'ts-loader',
+ exclude: /node_modules/
+ },
+ {
+ test: /\.css$/,
+ use: [
+ { loader: 'style-loader', options: { injectType: 'lazyStyleTag' } },
+ 'css-loader',
+ ],
+ exclude: /node_modules/
+ }
+ ],
+ },
+ resolve: {
+ extensions: ['.ts', '.js'],
+ },
+ output: {
+ filename: 'demo.js',
+ path: resolve('demo/dist'),
+ libraryTarget: 'umd',
+ umdNamedDefine: true
+ }
+};
diff --git a/demo/README.md b/demo/README.md
new file mode 100644
index 0000000..7c8d5d4
--- /dev/null
+++ b/demo/README.md
@@ -0,0 +1,5 @@
+### HOW TO RUN
+
+run `yarn run dev` and `yarn run demo` in separate terminals simultaneously.
+
+open `demo.html` in your browser.
diff --git a/demo/demo.html b/demo/demo.html
new file mode 100644
index 0000000..dd7a288
--- /dev/null
+++ b/demo/demo.html
@@ -0,0 +1,38 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/demo/demo_pod.ts b/demo/demo_pod.ts
new file mode 100644
index 0000000..c296bcf
--- /dev/null
+++ b/demo/demo_pod.ts
@@ -0,0 +1,61 @@
+import {
+ ChartwerkPod,
+ Serie,
+ Options
+} from '../dist/index';
+
+import * as d3 from 'd3';
+import * as _ from 'lodash';
+
+
+class DemoPod extends ChartwerkPod {
+ lineGenerator = null;
+
+ constructor(
+ _el: HTMLElement,
+ _series: Serie[] = [],
+ _options: Options = {},
+ ) {
+ super(_el, _series, _options);
+ }
+
+ override renderMetrics(): void {
+ this.clearAllMetrics();
+ this.initLineGenerator();
+ for(const serie of this.series.visibleSeries) {
+ this.renderLine(serie);
+ }
+ }
+
+ clearAllMetrics(): void {
+ // TODO: temporary hack before it will be implemented in core.
+ this.chartContainer.selectAll('.metric-el').remove();
+ }
+
+ initLineGenerator(): void {
+ this.lineGenerator = d3.line()
+ .x(d => this.state.xScale(d[0]))
+ .y(d => this.state.yScale(d[1]));
+ }
+
+ renderLine(serie: Serie): void {
+ this.metricContainer
+ .append('path')
+ .datum(serie.datapoints)
+ .attr('class', `metric-path-${serie.idx} metric-el ${serie.class}`)
+ .attr('fill-opacity', 0)
+ .attr('stroke', serie.color)
+ .attr('stroke-width', 1)
+ .attr('stroke-opacity', 0.7)
+ .attr('pointer-events', 'none')
+ .attr('d', this.lineGenerator);
+ }
+
+ onMouseMove(): void {}
+ onMouseOver(): void {}
+ onMouseOut(): void {}
+ renderSharedCrosshair(values): void {}
+ hideSharedCrosshair(): void {}
+}
+
+export { DemoPod };
diff --git a/package.json b/package.json
index 04238f5..c8b9e6a 100755
--- a/package.json
+++ b/package.json
@@ -10,6 +10,7 @@
"scripts": {
"build": "webpack --config build/webpack.prod.conf.js",
"dev": "webpack --config build/webpack.dev.conf.js",
+ "demo": "webpack --config build/webpack.demo.conf.js",
"test": "echo \"Error: no test specified\" && exit 1"
},
"repository": {
diff --git a/tsconfig.json b/tsconfig.json
index 558c8fc..4c96b42 100755
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -1,7 +1,6 @@
{
"compilerOptions": {
"target": "es5",
- "rootDir": "./src",
"module": "esnext",
"declaration": true,
"declarationDir": "dist",
@@ -16,7 +15,6 @@
"noImplicitUseStrict": false,
"noImplicitAny": false,
"noUnusedLocals": false,
- "baseUrl": "./src",
"moduleResolution": "node"
}
}