davecharts v1.0.11

Charts

Javascript charts library

Links

NPM https://www.npmjs.com/package/davecharts

GitHub https://github.com/Dave4626/Charts

Installation

A) Use bundled JS file

You can use this project bundled into single javascript file (ES5) bundle.js

• Download bundle.js and add to your project
• Add script tag <script src="bundle.js"></script> to your html file
• And use it like so:

    ch.BarChart.GetBuilder("chartDiv001")
        .AddBar(new ch.Bar("abc", 1250, ch.Utilities.GetColor(3, 1), "mm")
        .AddBar(new ch.Bar("def", 899,  ch.Utilities.GetColor(3, 2), "mm")
        .AddBar(new ch.Bar("ghi", 650,  ch.Utilities.GetColor(3, 3), "mm")
        .AddBar(new ch.Bar("ghi", 1300, ch.Utilities.GetColor(3, 4), "mm")
        .SetTitle("Test chart")
        .SetUnits("mm")
        .SetAlignment("horizontal")
        .Build()
        .Draw();

B) use NPM and WebPack (for JS or TypeScript project)

• npm install --save davecharts
• in your js/ts code:

import { Bar, BarChart, CircularChart, Color, DoubleBar, DoubleBarChart, LineChart, Utilities } from "../../node_modules/davecharts/public/davecharts";

• then use like so

    LineChart.GetBuilder("chartDiv001")
        .AddPoint("abc", 1250)
        .AddPoint("def", 899)
        .AddPoint("ghi", 650)
        .AddPoint("ghi", 1300)
        .AddPoint("aaa", 1100)
        .AddPoint("bbb", 1200)
        .AddPoint("ccc", 800)
        .SetZero(500)
        .SetTitle("Test chart - zero at 500")
        .SetUnits("mm")
        .SetStrokeWidth(5)
        .SetPointDiameterEm(1.0)
        .SetDefaultLineColor(Color.FromHex("#7166ab"))
        .SetDefaultPointColor(Color.FromHex("#a21d68"))
        .Build()
        .Draw();

Examples