antv g2设置chart图例的legend为一条线与一个圆的组合

antv g2绘制带圆点的折线的时候，图例legend一般显示的是一条曲线而不带圆点，正是因为默认结构不满足需求，所以需要自定义图例容器的模板。g2一般与react配合使用。

注意：自定义模板时必须包含各个 dom 节点的 class，样式可以自定义。

chart.legend('type', {
      position: 'top-left',
      // itemGap: 20,//图例之间的距离
      offsetY: -15,
      clickable: false,
      hoverable: false,
      useHtml: true, // 针对分类类型图例，用于开启是否使用 HTML 渲染图例
      // containerTpl: '
',
      itemTpl: function itemTpl(value, color, checked, index) {
        // console.log(value, color, checked, index)
        let markerDom = '';
        if (value == '楼面地价（元/㎡）') {
          //正方形方块
          markerDom = '' +
            ' +
            '+ color + ';"/>' +
            '' +
            '';
        } else {
          //线条+圆点
          markerDom = '' +
            ' +
            '+ color + ';" />' +
            '+ color + '" stroke-width="2" fill="' + color + '" />' +
            '' +
            '';
        }

        let valueDom = '' + value + '';
        return '
+ value + '">' + markerDom + valueDom + '
';
      }
    })