如何修改Amcharts 5中的导出图标？（与Amcharts 4实现方式不同）

Amcharts 5 中修改导出图标的逻辑和 v4 不同，核心是通过配置 ExportMenu 的相关属性来实现，具体有两种常用方式：

1. 替换为内置图标 #

Amcharts 5 内置了一套图标库，可直接指定图标名称替换默认导出图标：

// 导入所需模块
import * as am5 from "@amcharts/amcharts5";
import * as am5exporting from "@amcharts/amcharts5/plugins/exporting";

// 创建图表实例后配置导出菜单
const exporting = am5exporting.Exporting.new(root, {
  menu: am5exporting.ExportMenu.new(root, {
    // 指定内置图标名称替换默认图标，比如 iconPrint、iconShare 等
    icon: "iconDownload"
  })
});

2. 使用自定义 SVG 图标 #

如果需要完全自定义图标样式，可直接传入 SVG 代码作为 icon 属性值：

const exporting = am5exporting.Exporting.new(root, {
  menu: am5exporting.ExportMenu.new(root, {
    icon: '<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M19 12V19H5V12H3V19C3 20.1 3.9 21 5 21H19C20.1 21 21 20.1 21 19V12H19ZM12 18L17 13H14V5H10V13H7L12 18Z" fill="currentColor"/></svg>'
  })
});

如果要修改菜单内单个导出选项的图标，同样在对应选项配置里设置 icon 属性即可：

const exporting = am5exporting.Exporting.new(root, {
  menu: am5exporting.ExportMenu.new(root, {
    items: [{
      label: "下载为 PNG",
      icon: "iconDownload",
      onClick: function() {
        this.export("png");
      }
    }, {
      label: "打印图表",
      icon: '<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M19 8H5V6H19V8ZM19 18H5V10H19V18ZM19 4H5C3.9 4 3 4.9 3 6V18C3 19.1 3.9 20 5 20H19C20.1 20 21 19.1 21 18V6C21 4.9 20.1 4 19 4Z" fill="currentColor"/></svg>',
      onClick: function() {
        this.print();
      }
    }]
  })
});

内容的提问来源于stack exchange，提问作者user3148270