<!doctype html>
<html>
<head>
<script src="//cdn.anychart.com/js/7.4.0/anychart.min.js"></script>
<style>
html, body, #container {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<div id="container"></div>
<script type="text/javascript">
anychart.onDocumentReady(function() {
//create column chart
chart = anychart.area();
//set container id for the chart
chart.container('container');
//set chart title text settings
chart.title().text('Range Spline-Area Chart');
//create area series with passed data
chart.rangeSplineArea([
{ low: 182, high: 1122},
{ low: 284, high: 1152},
{ low: 255, high: 1139},
{ low: 412, high: 1142},
{ low: 376, high: 1112},
{ low: 482, high: 1122},
{ low: 384, high: 1152},
{ low: 500, high: 1139},
{ low: 382, high: 1142},
{ low: 488, high: 1112},
{ low: 482, high: 1122},
{ low: 440, high: 1152},
{ low: 299, high: 1139},
{ low: 382, high: 1142},
{ low: 488, high: 1112}
]);
//initiate chart drawing
chart.draw();
});
</script>
</body>
</html>