如何使用 amcharts 4 更改图表颜色

Question

我正在使用 am4chart 在我的网站上制作折线图。网站背景是黑色的，所以我要把图表渲染成白色 https://imgur.com/G7KG4j3

我尝试在创建图表时更改图表填充，但绝对行不通。但是当我改变图表笔划时它起作用了（但只有轮廓而且很难看）

这是我创建图表的函数

/* Creating chart and set language to french */
      let chart = am4core.create("chartdiv", am4charts.XYChart);
      chart.paddingRight = 20;      
      chart.language.locale = am4lang_fr_FR;
      chart.fill = am4core.color("#fff")
      //chart.stroke = am4core.color("#fff")

      /* Create date, values axis and cursor */
      let dateAxis = chart.xAxes.push(new am4charts.DateAxis());  
      dateAxis.renderer.grid.template.location = 0;
      let valueAxis = chart.yAxes.push(new am4charts.ValueAxis());
      valueAxis.tooltip.disabled = true;
      valueAxis.renderer.minWidth = 35;      
      chart.cursor = new am4charts.XYCursor();

      /* Setting up the scrollbar */
      let scrollbarX = new am4charts.XYChartScrollbar();      
      chart.scrollbarX = scrollbarX;

我希望日期轴和数值轴以及滚动条的文字为空白（link 在我的图像中但没有描边） https://imgur.com/2LrWfZd

Answer 1

您需要访问图表的 background 属性。 chart本身没有fill属性。像这样使用它：

chart.background.fill = am4core.color("#123")

更新： 要更改轴标签的颜色，您需要在 AxisLabel 对象上手动进行。在你的情况下，我认为它应该看起来像这样：

dateAxis.renderer.labels.template.fill = am4core.color("#fff");
valueAxis.renderer.labels.template.fill = am4core.color("#fff");

如何使用 amcharts 4 更改图表颜色

How to change chart color with am4chart

javascript

charts

colors

reactjs

amcharts4