@nebula.js/sn-line-chart - npm Package Compare versions

Comparing version 0.9.26 to 0.10.0

package.json

 {
   "name": "@nebula.js/sn-line-chart",
-  "version": "0.9.26",
+  "version": "0.10.0",
   "description": "Line chart supernova",
@@ -5,0 +5,0 @@ "author": "QlikTech International AB",

README.md

@@ -11,4 +11,5 @@ # @nebula.js/sn-line-chart
 
+![line chart](./assets/sn-line-chart.png)
+
 ```js
-
 import { embed } from '@nebula.js/stardust';
@@ -19,13 +20,156 @@ import line from '@nebula.js/sn-line-chart';
 const nuked = embed(app, {
-  types: [{ // register line chart
-    name: 'linechart',
-    load: () => Promise.resolve(line);
-  }]
+  types: [
+    {
+      // register line chart
+      name: 'line-chart',
+      load: () => Promise.resolve(line),
+    },
+  ],
 });
 
 nuked.render({
-  element,
-  type: 'linechart',
-  fields: []
+  element: document.querySelector('.lines'),
+  type: 'line-chart',
+  fields: ['Date.autoCalendar.YearMonth', '=Avg(Gold)', '=Avg(Bitcoin)'],
+
+  // Overrides default properties
+  properties: {
+    title: 'Price of Gold and Bitcoin',
+    dataPoint: {
+      show: true,
+      showLabels: true,
+    },
+    gridLine: {
+      auto: false,
+    },
+    dimensionAxis: {
+      show: 'all',
+      dock: 'near',
+    },
+    measureAxis: {
+      spacing: 0.5,
+      dock: 'near',
+      show: 'all',
+      logarithmic: true,
+    },
+  },
 });
 ```
+
+## More examples
+
+### One dimension, two measures, area styling
+
+![line chart area](./assets/sn-line-chart-area.png)
+
+```js
+nuked.render({
+  element: document.querySelector('.lines'),
+  type: 'line-chart',
+  fields: ['Date.autoCalendar.YearMonth', '=Avg(Gold)', '=Avg(Bitcoin)'],
+
+  // Overrides default properties
+  properties: {
+    lineType: 'area',
+  },
+});
+```
+
+### One dimension, two measures, vertical orientation
+
+![line chart vertical](./assets/sn-line-chart-vertical.png)
+
+```js
+nuked.render({
+  element: document.querySelector('.lines'),
+  type: 'line-chart',
+  fields: ['Date.autoCalendar.Quarter', 'Date.autoCalendar.Year', '=Avg(Bitcoin)'],
+
+  // Overrides default properties
+  properties: {
+    orientation: 'vertical',
+    dimensionAxis: {
+      continuousAuto: false,
+      dock: 'near',
+    },
+    dataPoint: {
+      show: true,
+      showLabels: true,
+    },
+    preferContinuousAxis: false,
+  },
+});
+```
+
+### Two dimensions, one measure
+
+![line chart 2D](./assets/sn-line-chart-2d.png)
+
+```js
+nuked.render({
+  element: document.querySelector('.lines'),
+  type: 'line-chart',
+  // Two dimensions, one measure
+  fields: ['Date.autoCalendar.Quarter', 'Date.autoCalendar.Year', '=Avg(Bitcoin)'],
+  properties: {
+    measureAxis: {
+      dock: 'near',
+      show: 'all',
+      logarithmic: true,
+    },
+    dataPoint: {
+      show: true,
+      showLabels: true,
+    },
+  },
+});
+```
+
+### One dimension, two measures, two reference lines
+
+![line chart reference lines](./assets/sn-line-chart-ref-lines.png)
+
+```js
+nuked.render({
+      element: document.querySelector('.lines'),
+      type: 'line-chart',
+      fields: ['Date.autoCalendar.YearMonth', '=Avg(Gold)', '=Avg(Bitcoin)'],
+
+      // Overrides default properties
+      properties: {
+        refLine: {
+          refLines: [
+            {
+              label: '',
+              paletteColor: {
+                color: 'green',
+              },
+              refLineExpr: {
+                value: 52500,
+              },
+              show: true,
+            },
+            {
+              label: '',
+              paletteColor: {
+                color: 'red',
+              },
+              refLineExpr: {
+                value: 3570,
+              },
+              show: true,
+            },
+          ],
+        },
+        measureAxis: {
+          dock: 'near',
+          show: 'all',
+          logarithmic: true,
+        },
+        dataPoint: {
+          show: true,
+        },
+      },
+    });
+  });
+```

No alert changes

Improved metrics

Total package byte prevSize

1807619

increased by0.15%

Number of lines in readme file

174

increased by480%

Worsened metrics

Lines of code

8009

decreased by-0.01%

No dependency changes