getEquipEch(arr, totla) { if (arr) { const chart = this.$refs.getEquipEchart; if (chart) { let barChart = this.$echarts.init(chart); const option = { color: ["#9933ce", "#285feb", "#04b7f9", "#6b5bf4"], title: { text: totla + "台", //图形标题,配置在中间对应效果图的位置 left: "72%", top: "32%", textStyle: { color: "rgb(50,197,233)", fontSize: 20, align: "center", }, }, tooltip: { trigger: "item", }, legend: { type: "scroll", orient: "vertical", left: "left", textStyle: { color: "#fft", fontSize: 14 }, itemGap: 20, formatter: function (name) { return name.length > 16 ? name.substr(0, 16) + "..." : name; }, }, series: [ { type: "pie", radius: ["55%", "80%"], center: ["80%", "40%"], // left top avoidLabelOverlap: false, label: { show: false, //position: 'center' position: "inner", }, emphasis: { label: { show: false, fontSize: "20", fontWeight: "bold", }, }, labelLine: { show: false, }, // data: [ // { value: 1048, name: '土壤水分监测器' }, // ] data: arr, }, ], }; barChart.setOption(option); var _this = this; barChart.on("legendselectchanged", function (params) { barChart.setOption({ legend: { selected: { [params.name]: true } }, }); console.log("点击了", params.name); var str = params.name; var result = /^\D+(?=\d)/.exec(str); _this.goDeviceDate(result); }); } } },
复制
echarts文字显示部分,超出显示省略号
转载请注明出处或者链接地址:https://www.qianduange.cn//article/1549.html
发布的文章
js实现动态数字滚动,插件jquery.counterup.min.js的使用方式
2024-02-22 11:02:40
echarts 3D柱状图
2024-02-22 11:02:39
jQuery的介绍以及应用场景
2024-02-22 11:02:39
JQuery工具框架
2024-02-22 11:02:38
【漏洞复现】jQuery-1.7.2 版本任意文件下载漏洞复现
2024-02-22 11:02:33
JavaScript和jQuery的关系
2024-02-22 11:02:33
jQuery淡入 淡出 —— W3school 详解 简单易懂(五)
2024-02-22 11:02:33
JQuery过滤选择器-如何让某个元素换颜色(俩种方式)
2024-02-22 11:02:32
jQuery下载使用
2024-02-22 11:02:11
echart图表渲染合并策略
2024-02-22 11:02:06
大家推荐的文章