echarts [Bug] 当前markPoint显示被裁剪,超出了屏幕 (The current markPoint display is cropped and exceeds the screen)

puruo6ea  于 5个月前  发布在  Echarts
关注(0)|答案(5)|浏览(105)

Version

5.5.0

{ tooltip: { confine: true, extraCssText: "maxWidth: 80%;max-height:60%;white-space: normal; word-break: break-all;overflow: auto;", trigger: "axis", enterable: true, backgroundColor: " #80 ", borderColor: "#00000000", axisPointer: { type: "line", }, textStyle: { color: "#fff", fontSize: 12, fontFamily: "Microsoft Yahei", }, formatter: (params) => { let dataStr = <div><p style="font-weight:normal;color:rgba(255, 255, 255, 1);margin: 0;">${params[0].name}\</p></div> ; params.forEach((item) => { let value = item.data; dataStr += <div> <div style="display: flex; align-items: center"> <span style="display:inline-block;margin-right:5px;width:10px;height:10px;border-radius:5px;background-color:${item.color}\;"></span> <span style="flex: 1">${item.seriesName}\</span> <span style="color:rgba(255, 255, 255, 1);margin-left:20px;">${value}\</span> </div> </div> ; }); return dataStr; }, }, legend: { padding: [0, 0, 0, 30], icon: "circle", itemHeight: 7, itemWidth: 7, type: "scroll", pageIconSize: 20, pageButtonItemGap: 0, pageIcons: { horizontal: [ "image://data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDkuMC1jMDAwIDc5LjE3MWMyN2ZhYiwgMjAyMi8wOC8xNi0yMjozNTo0MSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDI0LjAgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NzREMjQ0ODlDRDcxMTFFRTkzOUQ4OEQ2QkJDNkNGNzQiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NzREMjQ0OEFDRDcxMTFFRTkzOUQ4OEQ2QkJDNkNGNzQiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo3NEQyNDQ4N0NENzExMUVFOTM5RDg4RDZCQkM2Q0Y3NCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo3NEQyNDQ4OENENzExMUVFOTM5RDg4RDZCQkM2Q0Y3NCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pk1OMwcAAADRSURBVHja7NYxCwFhHMfxO5mVshssXoLMFoPBYDayGHgfIgblJVgMrFZ5CRYls1BGKd+rGy4jp37q99RneYbr2z09979wOJ4FyisTiC8HOtCBDnSgAx340WrgiAvaaoF9LFFEHpNvHpZNMSx61hTdt/2cQmD0phaopX0caQSWsEZZ8ZJUsftVXBqB0bEWlD8zofp3sIWzcuAWFeyVJ8khviwb5VF3RR1z5Vn8QAcDPBP7d7VZPEITJ9zQU5nFybWK+X/QgQ50oAMd6MA/D3wJMABtgRpiehSNvwAAAABJRU5ErkJggg==", "image://data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDkuMC1jMDAwIDc5LjE3MWMyN2ZhYiwgMjAyMi8wOC8xNi0yMjozNTo0MSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDI0LjAgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6OTBDQjM1MTJDRDcxMTFFRTkzOUQ4OEQ2QkJDNkNGNzQiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6OTBDQjM1MTNDRDcxMTFFRTkzOUQ4OEQ2QkJDNkNGNzQiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo3NEQyNDQ4RkNENzExMUVFOTM5RDg4RDZCQkM2Q0Y3NCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo3NEQyNDQ5MENENzExMUVFOTM5RDg4RDZCQkM2Q0Y3NCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Ph4vkUkAAADPSURBVHja7NatCsJQHIZxp8uCYDdYvAazRdBgMBu1GPQ+/MAi2KwWo8kqXoJlIGZRwSiCj7CwZJnCi7wHfrA0Hrb9z04wms4zyiubEV8OdKADHehABzrw4+rggiOaioEzFFDCGgO1wHziOocx3ue3UPkb7GETP1nZIalhh7LyFFewR1V5mylipb4PBsqBZ7TT3CD8YdwBDUSKT3AbD0ekOMUL1HFV2AfviesnhujiofIn6eOGE1qYfPt1pB2SZcznQQc60IEOdKAD/zTwJcAA6s4a8YwhQmkAAAAASUVORK5CYII=", ], }, textStyle: { color: "#565960", fontSize: 13, }, pageTextStyle: { color: "#565960", fontSize: 11, }, data: ["价格"], }, grid: { containLabel: true, left: "6%", right: "5%", bottom: "5%" }, xAxis: { type: "category", boundaryGap: false, axisTick: { show: false }, axisLabel: { formatter: function (params) { // YYYY-MM-DD时间正则 var regex = /^\d{4}-\d{2}-\d{2}$/; if (regex.test(params)) { var regexReplace = /-/g; var name = params.replace(regexReplace, ""); return name.substring(2); } return params; }, showMinLabel: true, showMaxLabel: true, hideOverlap: true, rotate: 0.0, alignMinLabel: "left", alignMaxLabel: "right", textStyle: { color: "#565960", fontSize: 12, }, }, axisLine: { width: 0.5, lineStyle: { color: "#e3e3e3", }, }, data: [ "2024-06-08", "2024-06-09", "2024-06-10", "2024-06-11", "2024-06-12", "2024-06-20", "2024-06-23", "2024-06-24", "2024-06-25", "2024-07-01", "2024-07-02", "2024-07-03", "2024-07-04", "2024-07-05", "2024-07-06", "2024-07-07", "2024-07-09", "2024-07-10", "2024-07-11", "2024-07-12", "2024-07-13", "2024-07-14", "2024-07-15", "2024-07-16", "2024-07-17", "2024-07-18", "2024-07-19", "2024-07-22", "2024-07-23", "2024-07-24", "2024-07-25", "2024-07-26", "2024-08-04", "2024-08-05", "2024-08-08", ], }, yAxis: { type: "value", scale: true, name: "元", nameTextStyle: { align: "left", }, splitLine: { lineStyle: { color: "#e3e3e3", width: 0.5 }, }, alignTicks: true, axisLabel: { textStyle: { color: "#565960", fontSize: 12, }, formatter(value) { function removeTrailingZeros(num) { num = num + ""; return num.replace(/.?0+$/, ""); } if (isNaN(value)) { return 0; } value = Number(value); absValue = Math.abs(value); if (absValue >= 100000000) { return removeTrailingZeros((value / 100000000).toFixed(2)) + "亿"; } else if (absValue >= 10000) { return removeTrailingZeros((value / 10000).toFixed(2)) + "万"; } else if (absValue < 10000) { return removeTrailingZeros(value.toFixed(2)); } }, }, yAxisIndex: 0, }, series: [ { name: "价格", type: "line", connectNulls: true, data: [ "1501", "1572", "1653", "1658", "1522", "1620.1", "2105", "2000", "1600", "1668", "1513", "1616", "1708", "1697", "1666", "1587", "1793", "1542", "1799", "1562", "1777", "1726", "1715", "1573", "1714", "1725", "1503", "1652.44", "1652.44", "1652.44", "1652.44", "2000", "1700", "1777.56", "2600.75", ], symbol: "none", color: "#F25353", markPoint: { symbol: "image://data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAqCAYAAACgLjskAAAAAXNSR0IArs4c6QAABC1JREFUWEe1l11oHFUUx/9nNh+NLRaVivFFzGLF9MPO3IlhM7s2PmhB21I1CSoq7YuoD2IJWH1TUQuliCBUqg9WooKt1aJINQWL2Y/WOHN3XUWr8aMvVvArTT80STtzZDa7m3UzOzMbd+/bMv9zfufee+45Zwl1rqPd3cvaOzqutZnbyI5Mn+eZkxvy+fNh3VCQ8Gh/f0vr1LlbQTwEYAOATg+bE8wYJTgj8WzW9PPpC0yp+mYQ7wTQHRRY6TuBP4MTedzIfZHzsvEEmkIsn2HsY2BLWFCV7iIIzxqW9RwBXPltAXBMiE6FMQpg9SJhZTMCj/wSjW4bOnDAnj+BCq/uzqYZSQBr/i+sbM94JZ61HvUEplWxnwmDDYPNU7bGLesN92f5SFOadhdABxsOm3N42mFn5c3Z7O8FIANKWohvwVjZJCAYvCsh5Y4CMKlpGwn0YRgYARMMGiXiSQBRZtwB4NIQtpNnzkx1FoApTR8B+P4Ao1mAhg1p7iHAKWkzsdjl9uzsXmIMBEEZvKkIFL8CuMq3QjAeM7LWy16a/YODkat//OkIgFsCoLtpTFVXKKT85isk/Hyqq+u6yvdUrc/o+k2Ow5/7A/kwpdf1rGPFyQYI98alfDjoyFKa+APAFTV1hBwlheglxnE/Z6UMCwH8wU0kH91XlNL16+HwiYAdHoxL6ZsUmVisw5mZdTO33cfXcfpk7dqlS1tapwBEfITn6OKFqJHP17zrpKo/SMSFalJrMeHd4jsU3xBwQ8AuP1hCNKBb1oVqXbKnp4tsx72WFb5AxpMFYFoVu5kwHHRHYKSdCO1ImGbGbTumEJfMMA8xaFcQrODbVlbPAUNl6nw4DEwRcLrY/dsCA50TZOPS0srFO6mJj2luhGjS4nviUr5TBo6pardCijsWtDaBmDSktd69hv90/JSmbwf4xQYDJyOOrcVyuZOu3wUjRkoVe0B4pEHQvwm8yZDy05K/BUAGKCPETmY84RVQHYFMEnigEua5w5LDtKrfzcT7ACyrA1KQuj2TCJv7LGtBBfOfS2/sWYWI47Ydr+G3VhyW0t52W9+xY395CQIn72L2pgBcFmKnX7e2RPp7x8f/rKUNBLqGxQn8UMCdnmU7oie+HP/eL7BQwEI1EuJtZtxb2xlvj0v5UtAphAeq6jVMihu9Vyn77lS0a5XfRFDzWfhFmFLFWyDcV60h8EOGlK8F7c73WXgZjwmxRWG8X/VtGh1Lroyn02cbDix2dbdZV9RbPhyX8vYwsLp3WMhYTeQr/+ww6JmENJ9uJvA9AHfOJwE/YEj5ZjOBrwPYWgYSNhqW9VHzgKp4AYSnSgBFod4+0xxvGtCd1ImUCQKWE3DIkFb5eMNAQz/8SmdJIYaJ8bzt2GvW53ITYUCLevglI1OI1n+YtyWkfLUe2KKeRb2Aav2/olZ67StSAHkAAAAASUVORK5CYII=", symbolSize: [13, 20], symbolOffset: [0, -10], data: [ { type: "max", name: "最大值", label: { backgroundColor: "rgba(249, 239, 240, 0.6)", padding: [6, 3, 3, 3], offset: [0, -21], color: "#C43233", }, symbol: "image://data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAqCAYAAACgLjskAAAAAXNSR0IArs4c6QAABC1JREFUWEe1l11oHFUUx/9nNh+NLRaVivFFzGLF9MPO3IlhM7s2PmhB21I1CSoq7YuoD2IJWH1TUQuliCBUqg9WooKt1aJINQWL2Y/WOHN3XUWr8aMvVvArTT80STtzZDa7m3UzOzMbd+/bMv9zfufee+45Zwl1rqPd3cvaOzqutZnbyI5Mn+eZkxvy+fNh3VCQ8Gh/f0vr1LlbQTwEYAOATg+bE8wYJTgj8WzW9PPpC0yp+mYQ7wTQHRRY6TuBP4MTedzIfZHzsvEEmkIsn2HsY2BLWFCV7iIIzxqW9RwBXPltAXBMiE6FMQpg9SJhZTMCj/wSjW4bOnDAnj+BCq/uzqYZSQBr/i+sbM94JZ61HvUEplWxnwmDDYPNU7bGLesN92f5SFOadhdABxsOm3N42mFn5c3Z7O8FIANKWohvwVjZJCAYvCsh5Y4CMKlpGwn0YRgYARMMGiXiSQBRZtwB4NIQtpNnzkx1FoApTR8B+P4Ao1mAhg1p7iHAKWkzsdjl9uzsXmIMBEEZvKkIFL8CuMq3QjAeM7LWy16a/YODkat//OkIgFsCoLtpTFVXKKT85isk/Hyqq+u6yvdUrc/o+k2Ow5/7A/kwpdf1rGPFyQYI98alfDjoyFKa+APAFTV1hBwlheglxnE/Z6UMCwH8wU0kH91XlNL16+HwiYAdHoxL6ZsUmVisw5mZdTO33cfXcfpk7dqlS1tapwBEfITn6OKFqJHP17zrpKo/SMSFalJrMeHd4jsU3xBwQ8AuP1hCNKBb1oVqXbKnp4tsx72WFb5AxpMFYFoVu5kwHHRHYKSdCO1ImGbGbTumEJfMMA8xaFcQrODbVlbPAUNl6nw4DEwRcLrY/dsCA50TZOPS0srFO6mJj2luhGjS4nviUr5TBo6pardCijsWtDaBmDSktd69hv90/JSmbwf4xQYDJyOOrcVyuZOu3wUjRkoVe0B4pEHQvwm8yZDy05K/BUAGKCPETmY84RVQHYFMEnigEua5w5LDtKrfzcT7ACyrA1KQuj2TCJv7LGtBBfOfS2/sWYWI47Ydr+G3VhyW0t52W9+xY395CQIn72L2pgBcFmKnX7e2RPp7x8f/rKUNBLqGxQn8UMCdnmU7oie+HP/eL7BQwEI1EuJtZtxb2xlvj0v5UtAphAeq6jVMihu9Vyn77lS0a5XfRFDzWfhFmFLFWyDcV60h8EOGlK8F7c73WXgZjwmxRWG8X/VtGh1Lroyn02cbDix2dbdZV9RbPhyX8vYwsLp3WMhYTeQr/+ww6JmENJ9uJvA9AHfOJwE/YEj5ZjOBrwPYWgYSNhqW9VHzgKp4AYSnSgBFod4+0xxvGtCd1ImUCQKWE3DIkFb5eMNAQz/8SmdJIYaJ8bzt2GvW53ITYUCLevglI1OI1n+YtyWkfLUe2KKeRb2Aav2/olZ67StSAHkAAAAASUVORK5CYII=", symbolSize: [13, 20], symbolOffset: [0, -10], }, { type: "min", name: "最小值", symbol: "image://data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAqCAYAAACgLjskAAAACXBIWXMAAAsTAAALEwEAmpwYAAAHOGlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgOS4wLWMwMDAgNzkuMTcxYzI3ZmFiLCAyMDIyLzA4LzE2LTIyOjM1OjQxICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdEV2dD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlRXZlbnQjIiB4bWxuczpzdFJlZj0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlUmVmIyIgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIiB4bWxuczpwaG90b3Nob3A9Imh0dHA6Ly9ucy5hZG9iZS5jb20vcGhvdG9zaG9wLzEuMC8iIHhtcDpDcmVhdGVEYXRlPSIyMDIzLTA2LTEzVDA5OjA5OjQwKzA4OjAwIiB4bXA6TWV0YWRhdGFEYXRlPSIyMDIzLTA2LTEzVDA5OjA5OjQwKzA4OjAwIiB4bXA6TW9kaWZ5RGF0ZT0iMjAyMy0wNi0xM1QwOTowOTo0MCswODowMCIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDplMjllYzkzOS1mM2Y4LTRiNjYtYmVjNy1hNTkzZTEzNDczOWYiIHhtcE1NOkRvY3VtZW50SUQ9ImFkb2JlOmRvY2lkOnBob3Rvc2hvcDpkZjQxYTFjZi1kYmMzLTI3NDctYWEyNi01ZWM0MTQxNTU5MWUiIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDozMDhiMWIxZS0yZmNlLTQ1MTktODY3NS1lNGEwMDEzMTZlMDEiIGRjOmZvcm1hdD0iaW1hZ2UvcG5nIiBwaG90b3Nob3A6Q29sb3JNb2RlPSIzIj4gPHhtcE1NOkhpc3Rvcnk+IDxyZGY6U2VxPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0ic2F2ZWQiIHN0RXZ0Omluc3RhbmNlSUQ9InhtcC5paWQ6MzA4YjFiMWUtMmZjZS00NTE5LTg2NzUtZTRhMDAxMzE2ZTAxIiBzdEV2dDp3aGVuPSIyMDIzLTA2LTEzVDA5OjA5OjQwKzA4OjAwIiBzdEV2dDpzb2Z0d2FyZUFnZW50PSJBZG9iZSBQaG90b3Nob3AgMjQuMCAoTWFjaW50b3NoKSIgc3RFdnQ6Y2hhbmdlZD0iLyIvPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0iZGVyaXZlZCIgc3RFdnQ6cGFyYW1ldGVycz0iY29udmVydGVkIGZyb20gYXBwbGljYXRpb24vdm5kLmFkb2JlLnBob3Rvc2hvcCB0byBpbWFnZS9wbmciLz4gPHJkZjpsaSBzdEV2dDphY3Rpb249InNhdmVkIiBzdEV2dDppbnN0YW5jZUlEPSJ4bXAuaWlkOmUyOWVjOTM5LWYzZjgtNGI2Ni1iZWM3LWE1OTNlMTM0NzM5ZiIgc3RFdnQ6d2hlbj0iMjAyMy0wNi0xM1QwOTowOTo0MCswODowMCIgc3RFdnQ6c29mdHdhcmVBZ2VudD0iQWRvYmUgUGhvdG9zaG9wIDI0LjAgKE1hY2ludG9zaCkiIHN0RXZ0OmNoYW5nZWQ9Ii8iLz4gPC9yZGY6U2VxPiA8L3htcE1NOkhpc3Rvcnk+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjMwOGIxYjFlLTJmY2UtNDUxOS04Njc1LWU0YTAwMTMxNmUwMSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDozMDhiMWIxZS0yZmNlLTQ1MTktODY3NS1lNGEwMDEzMTZlMDEiIHN0UmVmOm9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDozMDhiMWIxZS0yZmNlLTQ1MTktODY3NS1lNGEwMDEzMTZlMDEiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz7LV55FAAACd0lEQVRYw73YS6hNURzH8c/dXpFcKXKihJI86mYkigluEQkXE4+RkjJAHgMGDKSIEHFHMpFHHkkxQDGQRyjkVShlIK6bN3FN1qnTad+z196d4zfbe/3/67vXf631///PaSpdXSOn+mMkeuMnXuNLrHPPSJuZWIxWlFJsnuIKjuNurcmSDNg8PMQlrOwGBmOxFndwHS15gc04i/MYlzPk0wN4K5pigCXcxHzF1RPbcQw9agGbcRkT1EfLcKAWsB0T1VersSINuABtGqN9GFwJTLBT4zQQGyrv4WyMiXR+Ee5cB0ZjDgZE+K3CtjJwSYTDL6zHIfyteD8IR7AoYpWzyiGdEQHcgINVMPiIpbgWMce0JGzm0AzDV2Fl3ekPNkcAxycYFmF4JUxaS7fxIcOmlKBPBLAz8kB9yhjvkUQYCacxS30xPMPma4K3EeFqxZAMm7aIaL1N8BXPI4puO3p1Mz4KuyOicLd8LS5FGM8LR39qRdnpF+rkrXLqytDFptBitOB+jlTVGfa+FFqNGN3HpPIKH4SyFKtmjMgBg13V1WIdfjcoed/AyWrgE2xqAKwDy9GVVoD34nAdYd9CUn9dq6dZE+LdVYeVzcXVrCaqKyTitjwNbkrNnFINy+pLz2Ay3uWE3Qt+T4s0wo9DreyIhD0KafBj0c67fHpXRuzpZyzMKlFJ5JdfwIkMm20ROTkaCFtCX5OmZ9UNbz2Ab3C6m7E9ESUuNxBOpbz7ERHuwsDLKfn2WjgwDQF+T7lft/NMkBTIIi8znusO7EzJmQ0FVqe6940G7q1Y5bn/sYfvsSP8ZbKxyG/xItofrsKLvI5JQeBvHC3i+A/F7YKNQ/D6yQAAAABJRU5ErkJggg==", symbolSize: [13, 20], symbolOffset: [0, -10], label: { backgroundColor: "rgba(224, 243, 230, 0.6)", padding: [6, 3, 3, 3], offset: [0, -21], color: " #9933 ", }, }, ], }, itemStyle: { normal: { lineStyle: { width: 1, }, }, }, }, ], };

Steps to Reproduce

Current Behavior

The current markPoint display is cropped and exceeds the screen

Expected Behavior

Not crossing boundaries, not being trimmed

Environment

- OS: android
- Browser: android内核webview
- Framework: H5

Any additional comments?

No response

plupiseo

plupiseo1#

looks like you want to fit the chart on a narrow (phone) screen. Try grid: {right: '10%',... instead of grid: {right: '5%',...

ubbxdtey

ubbxdtey2#

looks like you want to fit the chart on a narrow (phone) screen. Try grid: {right: '10%',... instead of grid: {right: '5%',...

If the number is too long, it still cannot solve the problem

r55awzrz

r55awzrz3#

@Ovilia 大佬这个有解决方案吗?

guykilcj

guykilcj4#

Setting grid.right to be larger seems to be the only possible solution. You can calculate the min/max values and convert it into string and calculate the approximate width if necessary.

fwzugrvs

fwzugrvs5#

Setting grid.right to be larger seems to be the only possible solution. You can calculate the min/max values and convert it into string and calculate the approximate width if necessary.

谢谢羡辙大佬解答

相关问题