AmChart v4 tests

by Anton

HTML

<script src="https://www.amcharts.com/lib/4/core.js"></script>
<script src="https://www.amcharts.com/lib/4/charts.js"></script>
<div id="chartdiv"></div>

CSS

#chartdiv {
  width: 100%;
  height: 300px;
}

JavaScript

var chart = am4core.createFromConfig(getConfig(), "chartdiv", am4charts.XYChart);

function getConfig() {
	return {
    "xAxes": [{
      "type": "DateAxis",
      "dataFields": { "category": "DATEFROM" }
    }],

    "yAxes": [{ 
    	"type": "ValueAxis",
      "min": 0
    }],

    "series": [
      {
        "id": "inventory",
        "type": "ColumnSeries",
        "name": "Inventory",
        "strokeWidth": 0,
        "dataFields": {
          "valueY": "CLOSING",
          "dateX": "DATEFROM"
        },
        "columns": { "propertyFields": { "fill": "COLOR" } }
      }
    ],

    "data": [
      {
        "DATEFROM": "2018-12-27T00:00:00",
        "CLOSING": 3000,
        "SAFETYSTOCK": 0.0,
        "COLOR": "#f00"
      },
      {
        "DATEFROM": "2018-12-28T00:00:00",
        "CLOSING": 5000,
        "SAFETYSTOCK": 0.0,
        "COLOR": "#0f0"
      },
      {
        "DATEFROM": "2018-12-29T00:00:00",
        "CLOSING": 4000,
        "SAFETYSTOCK": 0.0,
        "COLOR": "#00f"
      }
    ]
  };
}