zoukankan      html  css  js  c++  java
  • (原)Echarts 报Uncaught Error: Initialize failed: invalid dom 根本解决

    1.循环出的Echarts出现 Uncaught Error: Initialize failed: invalid dom ,附上完美解决方案

    setTimeout(function () {
    console.log(item.id)
    console.log(item.val)
    console.log(item.color)
    var option = {
    legend: {
    orient: "vertical",
    x: "left",
    y: "top"
    },
    series: [{
    name: "访问来源",
    type: "pie",
    radius: ["88%", "100%"],
    avoidLabelOverlap: false,
    label: {
    normal: {
    show: false,
    position: "center"
    },
    emphasis: {
    show: true,
    textStyle: {}
    }
    },
    labelLine: {
    normal: {
    show: false
    }
    },
    data: [{
    value: item.val
    },
    {
    value: 100 - item.val
    }
    ],
    color: [item.color, "#e9e9e9"]
    }]
    };
    
    console.log($("#ecartsid_1"));
    let myChart = echarts.init(document.getElementById(item.id));
    myChart.setOption(option);
    myChart = null;
    }, 1)
      
    

    2.结合vue 

    view 结构:

    <li v-for="(item ,index) in listcardData" :style="">
     
    <div>
    <div class="doughnutChart" id="my_doughnut_chart_item">
    <div class="doughnutChart_center_w" :style="{'color':item.color }">{{item.val}}<img class="doughnutChart_center_w_img" :src="item.imgUrl_i"></img>
    </div>
    <div :id="item.id" class="doughnutChart_center"></div>
    {{mutation_listCardFn(item)}}

    </div>
    </div>
    </li>
    https://www.tongbiao.xyz/
  • 相关阅读:
    软件工程周总结09
    单词统计
    第一期冲刺03
    第一期冲刺02
    第一期冲刺01
    人月神话阅读笔记03
    团队冲刺四
    团队冲刺三
    团队冲刺二
    单词统计
  • 原文地址:https://www.cnblogs.com/tongbiao/p/9447106.html
Copyright © 2011-2022 走看看