当前位置:   article > 正文

echarts 树图样式美化_Echarts中状态树的使用,以及symbol节点用图片替代展示

echarts树状图symbol

需求:使用状态树,以及节点换作图片

实际操作

html部分:

js部分:

drawChart() { // 此处将方法封装了函数(需调用)

var pieId = document.getElementById("tree");

if (!pieId) {

return false;

}

let myChart = this.$echarts.init(pieId);

let option = {};

// 使用刚指定的配置项和数据显示图表。

myChart.setOption(

(option = {

tooltip: {

trigger: "item",

triggerOn: "mousemove",

},

series: [

{

type: "tree",

data: [treeJson], // 此处为重点:外引的json数据

nodePadding: 20,

top: "1%",

left: "10%",

bottom: "1%",

right: "10%",

symbol: 'image', // 此处亦为重点---> 节点换成图片即为此

symbolSize: [80, 20],

roam: true,

itemStyle: {

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/2023面试高手/article/detail/427625
推荐阅读
相关标签
  

闽ICP备14008679号