LCJS 2.0.0

Author: Snekw

README.md

@@ -34,11 +34,11 @@ To ensure that the figures can be zoomed up to desired details, users can set an
 
 ## API Links
 
-* Axis tick strategies: [AxisTickStrategies]
-* XY cartesian chart: [ChartXY]
-* OHLC series types: [OHLCSeriesTypes]
-* series with automatic packing: [OHLCSeriesWithAutomaticPacking]
-* Progressive trace generator: [ProgressiveTraceGenerator]
+* [Axis tick strategies]
+* [XY cartesian chart]
+* [OHLC series types]
+* [series with automatic packing]
+* [Progressive trace generator]
 
 
 ## Support
@@ -62,9 +62,9 @@ Direct developer email support can be purchased through a [Support Plan][4] or b
 © Arction Ltd 2009-2020. All rights reserved.
 
 
-[AxisTickStrategies]: https://www.arction.com/lightningchart-js-api-documentation/v1.3.0/globals.html#axistickstrategies
-[ChartXY]: https://www.arction.com/lightningchart-js-api-documentation/v1.3.0/classes/chartxy.html
-[OHLCSeriesTypes]: https://www.arction.com/lightningchart-js-api-documentation/v1.3.0/globals.html#ohlcseriestypes
-[OHLCSeriesWithAutomaticPacking]: https://www.arction.com/lightningchart-js-api-documentation/v1.3.0/classes/ohlcserieswithautomaticpacking.html
-[ProgressiveTraceGenerator]: https://arction.github.io/xydata/classes/progressivetracegenerator.html
+[Axis tick strategies]: https://www.arction.com/lightningchart-js-api-documentation/v2.0.0/globals.html#axistickstrategies
+[XY cartesian chart]: https://www.arction.com/lightningchart-js-api-documentation/v2.0.0/classes/chartxy.html
+[OHLC series types]: https://www.arction.com/lightningchart-js-api-documentation/v2.0.0/globals.html#ohlcseriestypes
+[series with automatic packing]: https://www.arction.com/lightningchart-js-api-documentation/v2.0.0/classes/ohlcserieswithautomaticpacking.html
+[Progressive trace generator]: https://arction.github.io/xydata/classes/progressivetracegenerator.html
 

ohlcAutomaticPackingResolution.png

@@ -14,7 +14,7 @@
         "webpack-dev-server": "^3.9.0"
     },
     "dependencies": {
-        "@arction/lcjs": "^1.3.1",
+        "@arction/lcjs": "^2.0.0",
         "@arction/xydata": "^1.2.1",
         "clean-webpack-plugin": "^3.0.0",
         "webpack": "^4.41.2",

package.json

@@ -9,7 +9,8 @@ const {
     lightningChart,
     AxisTickStrategies,
     OHLCSeriesTypes,
-    emptyLine
+    emptyLine,
+    Themes
 } = lcjs
 
 // Import data-generator from 'xydata'-library.
@@ -38,41 +39,57 @@ const dataFrequency = 1 * 1000
 
 // Decide on an origin for DateTime axis.
 const dateOrigin = new Date(2018, 0, 1)
-const dateTimeTickStrategy = AxisTickStrategies.DateTime(dateOrigin)
-
 // Create charts and series for two different packing resolutions.
 const lc = lightningChart()
 const chartDefault = lc.ChartXY({
-    containerId: 'div1',
-    defaultAxisXTickStrategy: dateTimeTickStrategy
+    container: 'div1',
+    // theme: Themes.dark
 })
+// Use DateTime TickStrategy with custom origin date.
+chartDefault
+    .getDefaultAxisX()
+    .setTickStrategy(
+        AxisTickStrategies.DateTime,
+        (tickStrategy) => tickStrategy.setDateOrigin(dateOrigin)
+    )
+
+chartDefault
     .setTitle('Default packing resolution')
     .setAutoCursor(cursor => {
         cursor.disposeTickMarkerY()
         cursor.setGridStrokeYStyle(emptyLine)
     })
-    // Preventing ResultTable from getting cut at the edge
-    .setPadding({
-        right: 42
-    })
+// Preventing ResultTable from getting cut at the edge
+chartDefault.setPadding({
+    right: 42
+})
 
 // show title 'USD on Y axis
 chartDefault.getDefaultAxisY()
     .setTitle('USD')
 
 const chartLow = lc.ChartXY({
-    containerId: 'div2',
-    defaultAxisXTickStrategy: dateTimeTickStrategy
+    container: div2,
+    // theme: Themes.dark
 })
+// Use DateTime TickStrategy with custom origin date.
+chartLow
+    .getDefaultAxisX()
+    .setTickStrategy(
+        AxisTickStrategies.DateTime,
+        (tickStrategy) => tickStrategy.setDateOrigin(dateOrigin)
+    )
+
+chartLow
     .setTitle('Very small packing resolution')
     .setAutoCursor(cursor => {
         cursor.disposeTickMarkerY()
         cursor.setGridStrokeYStyle(emptyLine)
     })
-    // Preventing ResultTable from getting cut at the edge
-    .setPadding({
-        right: 42
-    })
+// Preventing ResultTable from getting cut at the edge
+chartLow.setPadding({
+    right: 42
+})
 
 // show title 'USD on Y axis
 chartLow.getDefaultAxisY()