continue the bascis

4 years ago · 173dade277
3 changed files with 44 additions and 11 deletions
--- a/examples/01-basic.html
+++ b/examples/01-basic.html
@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta content="text/html;charset=utf-8" http-equiv="Content-Type">
+    <meta content="utf-8" http-equiv="encoding">
+
+    <script src="../dist/index.js" type="text/javascript"></script>
+  </head>
+  <body>
+
+    hello
+    <div id="chart" style="width: 500px; height: 500px;"></div>
+
+    <script type="text/javascript">
+      var pod = new ChartwerkGaugePod(
+        document.getElementById('chart'),
+        [{ target: 'test', datapoints: [[90, 5], [0, 10], [45, 15], [180, 20], [270, 25]], radius: 30 }],
+        { usePanning: false, renderLegend: false, renderYaxis: false, renderXaxis: false, renderGrid: false }
+      );
+      pod.render();
+    </script>
+  </body>
+</html>
--- a/src/index.ts
+++ b/src/index.ts
@ -1,32 +1,42 @@
 import { ChartwerkBase, VueChartwerkBaseMixin, TickOrientation, TimeFormat, AxisFormat } from '@chartwerk/base';

 import * as d3 from 'd3';
-import * as _ from 'lodash';
+
+


 export class ChartwerkGaugePod extends ChartwerkBase<any, any> {
-  _metricsContainer: any;
+
+  // TODO: define the type better
+  private _dValue: d3.Selection<SVGTextElement, unknown, null, undefined>;

  constructor(el: HTMLElement, _series: any[] = [], _options: any = {}) {
    super(d3, el, _series, _options);
+    this._init();
  }

-  _renderMetrics(): void {
-  }

-
-  onMouseOver(): void {
-    // TODO: add
+  private _init() {
+    this._initValueText();
  }

-  onMouseMove(): void {
-    // TODO: add
+  private _initValueText(): void {
+    this._dValue = this._chartContainer
+      .append('text')
+      .text('hey you')
+      .attr('fill', 'black');
  }

-  onMouseOut(): void {
-    // TODO: add
+
+  _renderMetrics(): void {
+    
  }

+
+  /* handlers and overloads */
+  onMouseOver(): void {}
+  onMouseMove(): void {}
+  onMouseOut(): void { }
  renderSharedCrosshair(): void {}
  hideSharedCrosshair(): void {}
 }
--- a/src/types.ts
+++ b/src/types.ts