1.模板字符串换行问题

white-space: pre-wrap;

2. 鼠标移入  显示提示框   点击手动隐藏 

myChart.on("mouseover", function (params) {myChart.dispatchAction({type: "downplay",});
});

tooltip: {show: true, //是否显示提示框组件，包括提示框浮层和 axisPointer。trigger: 'item', //触发类型。item,axis,noneenterable: true,//鼠标是否可进入提示框浮层中，默认为false，showContent: true,          //是否显示提示框浮层triggerOn: 'click',//提示框触发的条件(mousemove|click|none)  showDelay: 0,   //浮层显示的延迟，单位为 ms，默认没有延迟，也不建议设置。在 triggerOn 为 'mousemove' 时有效。textStyle: {color: 'white',fontSize: 12},padding: [0, 8],hideDelay: 10,             //浮层隐藏的延迟formatter: (i) => (i.data) ? `<div class="map-tooltip"><h3>${i.data.title}</h3><i class="map-tooltip-close" οnclick="toolTipClose(this)">X</i></div>` : `` ,backgroundColor: 'none',  //提示框浮层的背景颜色。borderColor: "white",  //图形的描边颜色borderWidth: 0,alwaysShowContent: true,transitionDuration: 1,      //提示框浮层的移动动画过渡时间，单位是 s，设置为 0 的时候会紧跟着鼠标移动。
},

有两个注意点
1.triggerOn需要设置为click触发
2.enterable设置为true ，鼠标可以进入悬浮框内 

window.toolTipClose = this.toolTipClose   //在formatter中给元素绑定点击事件，点击事件需要先在window上挂载toolTipClose(e){e.parentNode.style.display = 'none'   //找到该元素父元素，设置display为none即可实现手动关闭
},

 点击事件  

window.sendObj = sendObj //在formatter中给元素绑定点击事件，点击事件需要先在window上挂载

 3.模板字符串

tooltip: {trigger: "item",padding: 5,confine: true, // 是否将tooltip框限制在图表的区域内enterable: true, // 允许鼠标移入提示悬浮层中hideDelay: 5, // 浮层隐藏的延迟axisPointer: { //坐标轴指示器，坐标轴触发有效 //默认为line，line直线，cross十字准星，shadow阴影type: "none",label: {textStyle: {color: "#fff"}}},borderRadius: '8px', // 边框圆角borderColor: "#fff", //设置边框颜色triggerOn: "mousemove|click", // 提示框触发的条件transitionDuration: 0.8, // 提示框浮层的移动动画过渡时间，单位是 sbackgroundColor: "#ffffff66", // 背景颜色position: function (point, params, dom, rect, size) {// 鼠标坐标和提示框位置的参考坐标系是：以外层div的左上角那一点为原点，x轴向右，y轴向下// 提示框位置var x = 0; // x坐标位置var y = 0; // y坐标位置// 当前鼠标位置var pointX = point[0];var pointY = point[1];// 提示框大小var boxWidth = size.contentSize[0];var boxHeight = size.contentSize[1];// boxWidth > pointX说明鼠标左边放不下提示框if (boxWidth > pointX) {x = pointX;} else {// x轴为当前鼠标位置在加10x = pointX + 10;}// boxHeight > pointY说明鼠标上边放不下提示框if (boxHeight > pointY) {y = 5;} else {// 上边放的下y = pointY - boxHeight;}return [x, y];},formatter: (params) => {const { data: { value } } = paramsvar dom = "";if (params.data.doorHeadImage) {dom = `<span style="width: 270px;height: 30px">查看监控</span>`;} else {dom = `<div>// 模板字符串中引入图片时，// 1.将图片引入 作为变量 // 2.将图片放入静态文件夹,防止编译<img style="margin-left: 5px;width: 32px;margin-top: 2px;height: 32px;" src="${home}" alt="" />  // 判断 是否有图片    ${ value.img ? `<img src="${value.img}" alt="" />` : ''}// 点击事件    // window.sendObj = sendObj // 在methods中挂载//在formatter中给元素绑定点击事件，点击事件需要先在window上挂载<span onClick = 'sendObj(${JSON.stringify(value)},this)'>查看监控</span>`;}return dom;},}