Skip to content
A JSCharting dashboard example written in TypeScript and built with webpack.
TypeScript JavaScript HTML CSS
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
css
src
README.md
index.html
package-lock.json
package.json
webpack.config.js

README.md

JSCharting: Any Chart. Anywhere.

JSCharting is a JavaScript chart library for visualizing your data, providing resolution independent results across all devices and platorms. Every JSCharting license includes the full suite of 150+ advanced chart types, interactive stock charts and JSMapping at no additional charge.

This example dashboard is written in typescript and built with webpack. A declarations (d.ts) file provides code completion for the JSCharting library which is used to generate the charts.

Visit https://jscharting.com/ for more information.

How to use

Install the necessary packages including JSCharting.

npm install

Run the webpack dev server: localhost:5051

npm run start

Or build the dashboard manually.

npm run build

How it works

The webpack build copies the JSCharting package resources (modules, mapping data, polyfills, icons library) to the ./dist/jsc/ folder. A wrapper module of the charting library is created in ./src/jscharting.ts to provide a single point of contact with the library which also specifies the location of these resource files globally.

import * as JSC from 'jscharting';

// Apply these defaults to all charts.
JSC.defaults({
	baseUrl: 'dist/jsc'
});

export default JSC;

When using the chart library, this wrapper is imported instead of package itself.

import * as JSC from './jscharting';

new JSC.Chart('targetDiv', {/*chart options*/})
You can’t perform that action at this time.