I'm trying to change the color of zoomOut button or so called "primaryButton" in amcharts5. However digging through documentation i couldn't find anything that works.
var root = am5.Root.new(divId);
root._logo.dispose();
var fpTheme = am5.Theme.new(root);
fpTheme.rule("Label").setAll({
fontSize: "1rem",
fill: am5.color(0x97a0b4)
// fill: am5.color(0x777777)
// minGridDistance: 30
});
fpTheme.rule("LineSeries").adapters.add("stroke", function(stroke, target) {
// console.log(stroke);
// return am5.color(0x4CAF50);
return am5.color(0x4ac445);
});
// this below doesn't work. The above code works just fine.
fpTheme.rule("Button").setAll({
minus: {
fill: am5.color(0x4ac445)
}
});
fpTheme.rule("Graphics").setAll({
minus: {
fill: am5.color(0x4ac445)
}
});
root.setThemes([
am5themes_Animated.new(root),
fpTheme
]);
Clicking on zoomOut button does show that green color "0x4ac445" but the button is still blue like this from docs https://www.amcharts.com/docs/v5/concepts/colors-gradients-and-patterns/
I've checked this code and it works fine.
// change zoom button color to red
root.interfaceColors.set("primaryButton", am5.color(0xff0000));
// change zoom button-hover color to black
root.interfaceColors.set("primaryButtonHover", am5.color(0x000000));