Echarts 实现显示六边形

我不是专业的前端开发，项目中需要用到，但是有点不符合需求，不过既然做了个效果，那就发出来，给有用的人用吧。

效果如下图所示：

代码如下：

function GetPolygon(side) {
　　//参数说明：side是六边形边长
　　let polygonP = [];//六边形六个顶点的列表，代表六边形
　　//let side = Math.sqrt(area / (3 * sqrt_3 / 2));//六边形边长
　　let midwid=Math.sqrt(3)/2*side //六边形高度的一半
　　let midx=side/2 //横向坐标 第一个点与原点的距离
　　//left top
　　let x = 0;//顶点x坐标 调整显示位置
　　let y = 0;//顶点y坐标  调整显示位置
　　//
　　polygonP.push([x+midx,y+midwid*2]);
　　polygonP.push([x+0,y+midwid]);
　　polygonP.push([x+midx,y+0]);
　　polygonP.push([x+midx+side,y+0]);
　　polygonP.push([x+midx*2+side,y+midwid]);
　　polygonP.push([x+midx+side,y+midwid*2]);
　　polygonP.push([x+midx,y+midwid*2]);

  return polygonP;
};
option = {
  tooltip: {
    trigger: 'axis'
  },
 legend: {
    data: ['bar', 'error']
  },
  dataZoom: [
    {
      type: 'slider',
      filterMode: 'none'
    },
    {
      type: 'inside',
      filterMode: 'none'
    }
  ],
  xAxis: {},
  yAxis: {},
  series: [
    
    {
      type: 'custom',
      renderItem: function (params, api) {
        if (params.context.rendered) {
          return;
        }
        params.context.rendered = true;
         let points = [];
         let mydata=GetPolygon(100)
        for (let i = 0; i < mydata.length; i++) {
          points.push(api.coord(mydata[i]));
        }
        let color = api.visual('color');
        return {
          type: 'polygon',
          transition: ['shape'],
          shape: {
            points:points
          },
          style: api.style({
            fill: color,
            stroke: echarts.color.lift(color, 0.1)
          })
        };
      },
      clip: true,
      data: GetPolygon(100)
    },
    
  ]
};