AnyChart sample

by cristiscu

HTML

<script src="https://cdn.anychart.com/js/7.2.0/anychart-bundle.min.js"></script>
<script src="https://cdn.anychart.com/js/7.2.0/anychart-bundle.min.js"></script>
<div id="container"></div>

CSS

html, body, #container {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}

JavaScript

anychart.onDocumentReady(function() {

    chart = anychart.areaChart();
    chart.splineArea(anychart.data.set([
        {x: "P1", value: 16},
        {x: "P2", value: 12},
        {x: "P3", value: 9},
        {x: "P5", value: 10},
        {x: "P6", value: 12.5},
        {x: "P7", value: 14},
        {x: "P8", value: 17},
        {x: "P9", value: 18},
    ]));

		chart.grid(0).enabled(true)
    		.evenFill(["#fff", "#66f"])
        .oddFill(["#fff", "#66f"])
        .layout('horizontal');

		chart.container('container').draw();
});