Not able to implement AmCharts Gauge type in SAPUI5

Question

I am trying to add a Gauge chart in my UI5 app. I am successfully able to implement the chart with "Series" type. So I am able to load the libs from manifest.json file. But When I am trying to implement the gauge chart. I am getting below mentioned error.

amcharts.js? eval:174 Uncaught TypeError: d.AmAngularGauge is not a constructor

I am using this code :

    var gaugeChart = AmCharts.makeChart( "chartdiv", {
    "type": "gauge",
    "theme": "light",
    "axes": [ {
    "axisThickness": 1,
    "axisAlpha": 0.2,
    "tickAlpha": 0.2,
    "valueInterval": 20,
    "bands": [ {
    "color": "#84b761",
    "endValue": 90,
    "startValue": 0
    }, {
    "color": "#fdd400",
    "endValue": 130,
    "startValue": 90
    }, {
    "color": "#cc4748",
    "endValue": 220,
    "innerRadius": "95%",
    "startValue": 130
    } ],
    "bottomText": "0 km/h",
    "bottomTextYOffset": -20,
    "endValue": 220
    } ],
      "arrows": [ {} ],
    "export": {
    "enabled": true
    }
    } );

In my View , I am rendering the map in VBox.

Regards, MS

Answer 1

You're not implementing a series chart in your code, you're implementing a gauge chart. The error is telling you that you didn't include the gauge.js file. amcharts.js isn't enough as it's the base library and serial.js does not contain the gauge chart classes. Make sure the following is included for your gauge chart:

<script type="text/javascript" src="https://www.amcharts.com/lib/3/amcharts.js"></script>
<script type="text/javascript" src="https://www.amcharts.com/lib/3/gauge.js"></script>
<!-- if you need other charts like pie, radar, and series include those js files -->
<!-- plugins such as export and dataloader also come after the chart includes -->

You can see what chart libraries need to be included for each type by looking at AmCharts' demos page.