Echarts — graphic 实现自定义图片/文字

本文介绍: 1.graphic 组件相关配置参考：ECh ar ts 图形元素组件（graphic）_w3c school2. graph ic 是与 series 同级别的对象，参考如下：series: [{ // ……}],graph ic: [{ type: ‘group‘,// 组（可以包含图形、文字、图片） left: 0, top: ‘bot t o m‘, children: [{ type: ‘rect‘, ..

2. graph ic 是与 series 同级别的对象，参考如下：

series: [{
    // ......
}],
graphic: [{
    type: 'group',// 组（可以包含图形、文字、图片）
    left: 0,
    top: 'bottom',
    children: [{
            type: 'rect',
            z: 100,
            left: '0',
            top: '0',
            shape: {
                width: 180,
                height: 100
            },
            style: {
                fill: '#f6f6f6',
            }
        },
        {
            type: 'image',// 图片
              left:10,
              top: 10,
              z: 100,
              bounding: 'raw',
              style: {
                  image: '/static/UserSys/product/cadre/Report/img/country.png',
                  width: 20,
                  height: 20,
              }
          },
          {
            type: 'text',// 文字
            z: 100,
            left: 45,
            top: 13,
            style: {
                fill: '#e46c11',
                text: '全球分布      ' + countryCounts + ' 国',
                font: '14px Microsoft YaHei'
            }
        },
        {
            type: 'image',
              left:10,
              top: 40,
              z: 100,
              bounding: 'raw',
              style: {
                  image: '/static/UserSys/product/cadre/Report/img/china.png',
                  width: 20,
                  height: 20,
              }
          },
          {
            type: 'text',
            z: 100,
            left: 45,
            top: 43,
            style: {
                fill: '#e46c11',
                text: '中籍员工  ' + chinaNaticeCount + ' 人',
                font: '14px Microsoft YaHei'
            }
        },
        {
            type: 'image',
              left:10,
              top: 70,
              z: 100,
              bounding: 'raw',
              style: {
                  image: '/static/UserSys/product/cadre/Report/img/global.png',
                  width: 20,
                  height: 20,
              }
          },
          {
            type: 'text',
            z: 100,
            left: 45,
            top: 73,
            style: {
                fill: '#e46c11',
                text: '外籍员工  ' + foreignNativeCount + ' 人',
                font: '14px Microsoft YaHei'
            }
        },
    ]
}]