Back

Zero-based stacking: Time series area plot

Stacked area chart for time series data where both series within a stack start from zero and overlap - useful for comparing two series to quickly see where one value deviates from the other. Enabled by setting stack 'type' to 'based'.

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": "low",
            "data": {
                "index": 2,
                "aggregation": "min"
            },
            "style": {
                "fillColor": "#2fc32f"
            },
            "stack": "default",
            "type": "line"
        },
        {
            "name": "high",
            "data": {
                "index": 3,
                "aggregation": "max"
            },
            "style": {
                "fillColor": "#b0dc0b"
            },
            "stack": "default",
            "type": "line"
        }
    ],
    "stacks": {
        "default": {
            "type": "based"
        }
    },
    "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