How to change amcharts pie themes?

Question

My HTML code is as follows:

<div id="chartdiv" style="width: 100%; height: 362px;"></div> 

My Javascript code is as follows:

 var chart; var legend; var chartData = [ { "country": "Czech Republic", "litres": 301.9 }, { "country": "Ireland", "litres": 201.1 }, { "country": "Germany", "litres": 165.8 }, { "country": "Australia", "litres": 139.9 }, { "country": "Austria", "litres": 128.3 }, { "country": "UK", "litres": 99 }, { "country": "Belgium", "litres": 60 } ]; console.log(chartData); AmCharts.ready(function () { // PIE CHART chart = new AmCharts.AmPieChart(); chart.dataProvider = chartData; chart.titleField = "country"; chart.valueField = "litres"; // WRITE chart.write("chartdiv"); }); 

The demo and full code is as follows: https://jsfiddle.net/oscar11/4qdan7k7/2/

I want to change amchart themes as follows: https://www.amcharts.com/demos/simple-pie-chart/

I add the light.js library, but the themes do not change

Any solution to solve my problem?

Answer 1

You need to specify the theme parameter during initialization, as shown below, and use makeChart directly instead of Amcharts.AmPieChart() . Your updated code:

 AmCharts.makeChart("chartdiv", { "type": "pie", "theme": "light", "dataProvider": chartData, "valueField": "litres", "titleField": "country", "export": { "enabled": true } }); 

UPDATED FIDDLE