javascript - 如何使用 am4chart 更改图表颜色

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;

我希望日期和值轴以及 scollbar 文字为空白（我的图像中的链接但没有中风） https://imgur.com/2LrWfZd

标签： javascriptreactjschartscolorsamcharts4

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");