Back

Simple time series area chart

JavaScript time series area chart with single series that shows change over time. Area chart type can be created by setting series 'type' to 'line' and then providing 'fillColor' value under 'style'.

Documentation Open in JSFiddle
Start Free Trial Purchase

HTML

HTML 
<script src="https://cdn.zoomcharts-cloud.com/1/nightly/zoomcharts.js"></script>
<div id="demo"></div>

CSS

CSS 
//No CSS for this example

JavaScript

JavaScript 
chart= new TimeChart({
    "series": [
        {
            "name": "Average open price, $",
            "data": {
                "index": 1,
                "aggregation": "avg"
            },
            "type": "line",
            "style": {
                "smoothing": true,
                "fillColor": "#2fc32f",
                "lineColor": "#2fc32f"
            }
        }
    ],
    "container": "demo",
    "data": [
        {
            "units": [
                "d"
            ],
            "url": "/dvsl/data/extra/appl.json"
        }
    ],
    "toolbar": {
        "fullscreen": true,
        "enabled": true
    },
    "interaction": {
        "resizing": {
            "enabled": false
        }
    }
})

Data

Data 
//Data too large to output
Download Data