VUE+ECharts 自定义toolTip样式

 在配置echarts的时候，需要自定义悬浮框的样式，可以在formatter里面直接返回一段html代码

tooltip:{
        show:true,
        backgroundColor: "transparent",
        borderColor: "transparent",
        confine: true,
        // showContent:false,
        formatter: (resp)=>{
          //插入html片段
          let frame = `
          <div class="MapDialog position-abs background-fill"
          style="width: 339px;height: 208px;background-image: url('${DialogBack}');transform: translate(-45%,-120%)"
          >
              <div class="md-content" style="width: 100%;height: 195px">
                  <div class="md-title flexr-mbt" style="height: 37px;padding: 0 10px 0 16px;">
                    <p class="md-title-text font-16" style="width: 14em;font-weight: blod;text-overflow: ellipsis;color: #fff">
                      ${resp.name}
                    </p>
                    <div
                      class="md-close background-fill"
                      style="background-image: url('${CloseIcon}');width: 16px;height: 16px;cursor: pointer;"
                    ></div>
                  </div>
                  <div class="md-container flexr-cm"
                  style="height: 195px;transform: translateY(-20%)"
                  >
                    <div class="md-icon-line flexr-cm"
                    style=" width: 50px;height: 27px;"
                    >
                      <div class="md-icon position-abs background-fill"                      
                      style="background-image: url('${ContentIcon}');width: 28px;height: 27px;"
                      ></div>
                      <div class="md-line position-abs"
                      style="width: 50px;height: 17px;border-right: 1px solid #95bae3;"
                      ></div>
                    </div>
                    <div class="md-desc"
                    style="margin-left: 15px;"
                    >
                      <div class="md-desc-text font-14"
                      style="color: #00ccff;"
                      >
                        商品数量：
                      </div>
                      <div class="md-desc-number font-38 font-dines"
                      style="font-style: italic;color: #fff;margin-top: 10px"
                      >
                        ${resp.value[2]}
                      </div>
                    </div>
                  </div>
                </div>
          </div>`
          return frame
        }
      }