如何在amcharts5中更改主按钮的颜色？

huangapple
go评论97阅读模式
英文:

How to change primaryButton color in amcharts5?

问题

我正在尝试更改amcharts5中的"zoomOut"按钮或称为"primaryButton"的颜色。但是，通过查阅文档，我找不到适用的方法。

  1. var root = am5.Root.new(divId);
  2. root._logo.dispose();
  4. var fpTheme = am5.Theme.new(root);
  6. fpTheme.rule("Label").setAll({
  7.     fontSize: "1rem",
  8.     fill: am5.color(0x97a0b4)
  9. });
  11. fpTheme.rule("LineSeries").adapters.add("stroke", function(stroke, target) {
  12.     return am5.color(0x4ac445);
  13. });
  15. // 以下代码不起作用，但上面的代码运行正常。
  16. fpTheme.rule("Button").setAll({
  17.     minus: {
  18.         fill: am5.color(0x4ac445)
  19.     }
  20. });
  22. fpTheme.rule("Graphics").setAll({
  23.     minus: {
  24.         fill: am5.color(0x4ac445)
  25.     }
  26. });
  28. root.setThemes([
  29.     am5themes_Animated.new(root),
  30.     fpTheme
  31. ]);

单击"zoomOut"按钮会显示绿色 "#4ac445"，但按钮仍然是蓝色的，类似于文档中的示例 https://www.amcharts.com/docs/v5/concepts/colors-gradients-and-patterns/。

英文:

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.

  1. var root = am5.Root.new(divId);
  2. root._logo.dispose();
  4. var fpTheme = am5.Theme.new(root);
  6. fpTheme.rule("Label").setAll({
  7.     fontSize: "1rem",
  8.     fill: am5.color(0x97a0b4)
  9.     // fill: am5.color(0x777777)
  10.     // minGridDistance: 30
  11. });
  13. fpTheme.rule("LineSeries").adapters.add("stroke", function(stroke, target) {
  14.     // console.log(stroke);
  15.     // return am5.color(0x4CAF50);
  16.     return am5.color(0x4ac445);
  17. });
  19. // this below doesn't work. The above code works just fine.
  21. fpTheme.rule("Button").setAll({
  22.     minus: {
  23.         fill: am5.color(0x4ac445)
  24.     }
  25. });
  27. fpTheme.rule("Graphics").setAll({
  28.     minus: {
  29.         fill: am5.color(0x4ac445)
  30.     }
  31. });
  33. root.setThemes([
  34.     am5themes_Animated.new(root),
  35.     fpTheme
  36. ]);

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/

答案1

得分: 1

我已检查此代码，它可以正常运行。

  1.     // 将缩放按钮颜色更改为红色
  2.     root.interfaceColors.set("primaryButton", am5.color(0xff0000));
  3.     
  4.     // 将缩放按钮悬停颜色更改为黑色
  5.     root.interfaceColors.set("primaryButtonHover", am5.color(0x000000));
英文:

I've checked this code and it works fine.

  1. // change zoom button color to red
  2. root.interfaceColors.set("primaryButton", am5.color(0xff0000));
  4. // change zoom button-hover color to black
  5. root.interfaceColors.set("primaryButtonHover", am5.color(0x000000));

huangapple
  • 本文由 发表于 2023年6月15日 21:31:00
  • 转载请务必保留本文链接：https://go.coder-hub.com/76483012.html
  • amcharts
  • amcharts5
  • javascript
  • jquery
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定