amCharts 5: How to Change Series Specific Stroke / Fill Settings in 100% Stacked Area Chart

Question

Reference: 100% Stacked Area Chart

I see colors can be modified as follows:

chart.get("colors").set("colors", [
  am5.color("#59A80F"),
  am5.color("#EA8676"),
  am5.color("#B90504")
]);

How can stroke / fill settings for (only) Motorcycles in the reference chart be changed so that (e.g.) the line color is red, and the area beneath it is green?

Answer 1

if your charts use "serious" variable to setting, try this:

series.set("fill", am5.color(0xff0000));

document: https://www.amcharts.com/docs/v5/concepts/colors-gradients-and-patterns/

Answer 2

Made an example integrating all color changes (background, map and dots):

// Create root
var root = am5.Root.new("chartdiv"); 

// Set themes
root.setThemes([
  am5themes_Animated.new(root)
]);

// Create chart
var chart = root.container.children.push(am5map.MapChart.new(root, {
  panX: "rotateX",
  panY: "none",
  projection: am5map.geoNaturalEarth1()
}));

chart.chartContainer.set("background", am5.Rectangle.new(root, {
  fill: am5.color("#ffffff"),
  fillOpacity: 1
}));

// Create polygon series
var polygonSeries = chart.series.push(am5map.MapPolygonSeries.new(root, {
  geoJSON: am5geodata_worldLow,
  exclude: ["AQ"],
  fill: "black"
}));

// Create point series
var pointSeries = chart.series.push(am5map.MapPointSeries.new(root, {}));

pointSeries.data.setAll([{
  "geometry": {
    "type": "Point",
    "coordinates": [-73.778137, 40.641312]
  }
}, {
  "geometry": {
    "type": "Point",
    "coordinates": [-0.454296, 51.470020]
  }
}, {
  "geometry": {
    "type": "Point",
    "coordinates": [116.597504, 40.072498]
  }
}]);

pointSeries.bullets.push(function() {
  return am5.Bullet.new(root, {
    sprite: am5.Circle.new(root, {
      radius: 5,
      fill: am5.color("#ff0000")
    })
  });
});

• https://codepen.io/binarytrails/pen/ExdoLoP