Skip to content

Commit

Permalink
LCJS 3.0.0
Browse files Browse the repository at this point in the history
  • Loading branch information
Snekw committed May 5, 2021
1 parent c273def commit 501b8c0
Show file tree
Hide file tree
Showing 7 changed files with 312 additions and 1 deletion.
3 changes: 3 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
node_modules
dist
package-lock.json
104 changes: 103 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
@@ -1,2 +1,104 @@
# lcjs-example-1001-polarMicrophoneSensitivity
# Polar Microphone Sensitivity

![Polar Microphone Sensitivity](polarMicrophoneSensitivity.png)

This demo application belongs to the set of examples for LightningChart JS, data visualization library for JavaScript.

LightningChart JS is entirely GPU accelerated and performance optimized charting library for presenting massive amounts of data. It offers an easy way of creating sophisticated and interactive charts and adding them to your website or web application.

The demo can be used as an example or a seed project. Local execution requires the following steps:

- Make sure that relevant version of [Node.js](https://nodejs.org/en/download/) is installed
- Open the project folder in a terminal:

npm install # fetches dependencies
npm start # builds an application and starts the development server

- The application is available at *http://localhost:8080* in your browser, webpack-dev-server provides hot reload functionality.


## Description

This example showcases a simple Polar Chart with five Line Series.

Polar Charts are used for visualizing data relationships in terms of radiuses and angles.

## Polar coordinate system and PolarLineSeries

```typescript
{
// Data point angle as degrees [0, 360].
angle: 0,
// Data point position on the *Amplitude Axis*. Determines its location between the Charts origin and outer edge.
amplitude: 50
}
```

*PolarLineSeries* connects a list of such *PolarPoints* with a continuous line.

[//]: # "IMPORTANT: The assets will not show before README.md is built - relative path is different!"

![Two Polar Line Series](./assets/polarLineSeries.png)


## PolarRadialAxis

The coordinate system can be rotated with methods of *PolarRadialAxis**.

```typescript
// Configure Polar Radial Axis.
const radialAxis = polar.getRadialAxis()
// 0 = North
.setRotation(90)
// Clockwise direction.
.setInverted(true)
```

## PolarAmplitudeAxis

Similarly, the visible range of amplitude values can be configured with methods of *PolarAmplitudeAxis*. The default configuration is to fit

```typescript
const amplitudeAxis = polar.getAmplitudeAxis()
// Set amplitude interval explicitly.
// [-39 dB, 0 dB]
.setInterval(-39, 0)
.setTitle('Sensitivity (dB)')
```

## API Links

* [Polar chart]
* [Polar line series]
* [Polar radial axis]
* [Polar amplitude axis]
* [Polar point]


## Support

If you notice an error in the example code, please open an issue on [GitHub][0] repository of the entire example.

Official [API documentation][1] can be found on [Arction][2] website.

If the docs and other materials do not solve your problem as well as implementation help is needed, ask on [StackOverflow][3] (tagged lightningchart).

If you think you found a bug in the LightningChart JavaScript library, please contact [email protected].

Direct developer email support can be purchased through a [Support Plan][4] or by contacting [email protected].

[0]: https://github.com/Arction/
[1]: https://www.arction.com/lightningchart-js-api-documentation/
[2]: https://www.arction.com
[3]: https://stackoverflow.com/questions/tagged/lightningchart
[4]: https://www.arction.com/support-services/

© Arction Ltd 2009-2020. All rights reserved.


[Polar chart]: https://www.arction.com/lightningchart-js-api-documentation/v3.0.0/classes/polarchart.html
[Polar line series]: https://www.arction.com/lightningchart-js-api-documentation/v3.0.0/classes/polarlineseries.html
[Polar radial axis]: https://www.arction.com/lightningchart-js-api-documentation/v3.0.0/interfaces/polaraxisradial.html
[Polar amplitude axis]: https://www.arction.com/lightningchart-js-api-documentation/v3.0.0/classes/polaraxisamplitude.html
[Polar point]: https://www.arction.com/lightningchart-js-api-documentation/v3.0.0/interfaces/polarpoint.html

Binary file added assets/polarLineSeries.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
23 changes: 23 additions & 0 deletions package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
{
"version": "1.0.1",
"scripts": {
"build": "webpack --mode production",
"start": "webpack-dev-server"
},
"license": "Custom",
"private": true,
"main": "./src/index.js",
"devDependencies": {
"copy-webpack-plugin": "^6.0.2",
"html-webpack-plugin": "^3.2.0",
"webpack-cli": "^3.3.10",
"webpack-dev-server": "^3.9.0"
},
"dependencies": {
"@arction/lcjs": "^3.0.0",
"@arction/xydata": "^1.4.0",
"clean-webpack-plugin": "^3.0.0",
"webpack": "^4.41.2",
"webpack-stream": "^5.2.1"
}
}
Binary file added polarMicrophoneSensitivity.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
107 changes: 107 additions & 0 deletions src/index.js

Large diffs are not rendered by default.

76 changes: 76 additions & 0 deletions webpack.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,76 @@
const HtmlWebpackPlugin = require('html-webpack-plugin')
const { CleanWebpackPlugin } = require('clean-webpack-plugin')
const CopyWebpackPlugin = require('copy-webpack-plugin')
const path = require('path')

const targetFolderName = 'dist'
const outputPath = path.resolve(__dirname, targetFolderName)
const packageJSON = require('./package.json')


module.exports = {
mode: 'development',
entry: {
app: packageJSON.main
},
node: {
buffer: false,
setImmediate: false
},
devServer: {
contentBase: outputPath,
compress: true,
// handle asset renaming
before: function(app, server, compiler){
app.get('/examples/assets/*', (req, res, next)=>{
if(req.originalUrl.match(/lcjs_example_\d*_\w*-/g)){
res.redirect(req.originalUrl.replace(/lcjs_example_\d*_\w*-/g,''))
}
else{
next()
}
})
}
},
resolve: {
modules: [
path.resolve('./src'),
path.resolve('./node_modules')
],
extensions: ['.js']
},
output: {
filename: 'js/[name].[contenthash].bundle.js',
chunkFilename: 'js/[name].[contenthash].bundle.js',
path: outputPath
},
optimization: {
splitChunks: {
chunks: 'all',
cacheGroups: {
// make separate 'vendor' chunk that contains any depenedencies
// allows for smaller file sizes and faster builds
vendor: {
test: /node_modules/,
chunks: 'initial',
name: 'vendor',
priority: 10,
enforce: true
}
}
},
runtimeChunk: 'single'
},
plugins: [
new CleanWebpackPlugin(),
new HtmlWebpackPlugin({
title: "app",
filename: path.resolve(__dirname, 'dist', 'index.html')
}),
new CopyWebpackPlugin({
patterns: [
{ from: './assets/**/*', to: './examples/assets', flatten: true, noErrorOnMissing: true }
]
})
]
}

0 comments on commit 501b8c0

Please sign in to comment.