如何更改amcharts中图表的所有项目符号标签颜色答案

【问题标题】：How to change all bullets label color of chart in amcharts如何更改amcharts中图表的所有项目符号标签颜色
【发布时间】：2020-12-17 07:38:23
【问题描述】：

enter image description here

var chart = am4core.create("all_realtime", am4charts.XYChart);
                            chart.data = chartdata;
                            // Create axes
                            var dateAxis = chart.xAxes.push(new am4charts.DateAxis());
                            dateAxis.dataFields.category = "commonReqDt";
                            dateAxis.title.text = "TIME";
                            dateAxis.title.fill = am4core.color("#aab8c5");
                            dateAxis.renderer.labels.template.fill = am4core.color("#fff");

                            var valueAxis = chart.yAxes.push(new am4charts.ValueAxis());
                            valueAxis.renderer.labels.template.fill = am4core.color("#aab8c5");
                            valueAxis.renderer.baseGrid.stroke = am4core.color("#454e5b");
                            valueAxis.renderer.grid.template.stroke = am4core.color("#454e5b");
                            valueAxis.renderer.grid.template.strokeWidth = 1;
                            valueAxis.renderer.grid.template.strokeOpacity = 0.8;
                            valueAxis.title.text = "SCORE";
                            valueAxis.title.fill = am4core.color("#aab8c5");
                            valueAxis.max = 1;

function createSeries(field, name, tooltip, color) {
                                var series = chart.series.push(new am4charts.XYSeries());
                                series.dataFields.valueY = field;
                                series.dataFields.dateX = "commonReqDt";
                                series.name = name;
                                var bullet = series.bullets.push(new am4charts.LabelBullet());
                                bullet.label.text = name;
                                bullet.label.fill = am4core.color(color);
                                bullet.tooltipText = "aaaa"
                                bullet.tooltip = new am4core.Tooltip();
                                bullet.tooltip.getFillFromObject = false;
                                bullet.tooltip.label.fill = am4core.color("#fff");
                                bullet.tooltip.background.fill = am4core.color("#664cfd");
                                bullet.events.on("hit", function(event){
                                    //click Event

                                    //this working
                                    event.target.label.fill = am4core.color("green");

                                     //this not working
                                    bullet.label.fill = am4core.color("green");         
                                });
                               return series;
                            }

                            createSeries("100", "O", "OK", "#fff");

嗨，我是初学者。我想改变所有的子弹，但只知道一个子弹。单击项目符号时，如何更改 amcharts 中图表的所有项目符号标签颜色。请帮帮我

【问题讨论】：

标签： amcharts

【解决方案1】：

如果您想在单击任何人时更改所有项目符号。不要定位你点击的那个，试试这样：

bullet.events.on("hit", function(event){
    //click Event
    //set ALL bullets
    bullet.label.fill = am4core.color("green");
});

-- 通常用于更改项目符号颜色和边框

var bullet = series.bullets.push(new am4charts.LabelBullet());
bullet.fill = am4core.color("#000"); // fill bullets with black
bullet.stroke = am4core.color("#000"); // bullets' borders in black

labelbullet 的文档：https://www.amcharts.com/docs/v4/reference/labelbullet/

【讨论】：

感谢您的回答。但我已经尝试过这段代码->'bullet.label.fill = ...'。不工作..
我试过 bullet.events.on("hit", function(event){ //点击事件 //设置所有子弹 bullet.label.fill = am4core.color("green"); } );不工作。
我明白了，但你试过了吗：bullet.fill，取下“标签”？
是的。我试过了。不是错误。只是不工作
请在 jsfiddle.net 上分享。没有看到，我无法提供更多帮助。

【解决方案2】：

使用 CircleBullet 而不是 LabelBullet。 LabelBullet 用于文本，使用“O”字符作为临时项目符号并不是最佳选择。如果您仍然想要一个被填充的空圆圈，只需根据自己的喜好调整项目符号的 fill 和 stroke：

    // start with empty/white filled circle
    var bullet = series.bullets.push(new am4charts.CircleBullet());
    bullet.fill = am4core.color("#fff");
    bullet.stroke = color;
    // ...
    // fill in every bullet on click
    bullet.events.on("hit", function(event) {
       bullet.fill = am4core.color("red");         
    });

更新小提琴：https://jsfiddle.net/aq9xd7r1/

【讨论】：