You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@echarts.apache.org by GitBox <gi...@apache.org> on 2018/11/12 09:07:21 UTC

[GitHub] luruxi opened a new issue #9383: echarts渲染不出来报错

luruxi opened a new issue #9383: echarts渲染不出来报错
URL: https://github.com/apache/incubator-echarts/issues/9383
 
 
   <!--
   为了方便我们能够复现和修复 bug,请遵从下面的规范描述您的问题。
   -->
   
   
   ### One-line summary [问题简述]
   vue+echarts渲染的图表比较多,有时候会出现一个图表不显示的问题,再次操作全部图表都不显示了,会有个报错,尝试更改echarts版本没效--TypeError:null is not an object(evaluating 'this.ctx.dpr=this.dpr')
   ![image](https://user-images.githubusercontent.com/33649116/48336225-cd637700-e69a-11e8-9d0f-40a0a3a4efe9.png)
   
   
   
   
   ### Version & Environment [版本及环境]
   + ECharts version [ECharts 版本]:4.0.4,3.8.4,3.5.4都尝试过
   + Browser version [浏览器类型和版本]:ios手机safari,iphone 8P(12.1),7P(12.1),6P有问题;iphone 6s(10)没问题
   + OS Version [操作系统类型和版本]:ios12.1
   
   
   
   
   
   ### Expected behaviour [期望结果]
   能够指导下怎么个情况,各种尝试都没能解决,资料也没有查到
   
   
   
   
   ### ECharts option [ECharts配置项]
   <!-- Copy and paste your 'echarts option' here. -->
   <!-- [下方贴你的option,注意不要删掉下方 ```javascript 和 尾部的 ``` 字样。最好是我们能够直接运行的 option。如何得到能运行的 option 参见上方的 guidelines for contributing] -->
   ```javascript
   option = {
   
   }
   resourceDatachushi(el){
             let _this=this
           let dataT=el
   
           let xinshuzu=[]
          for(let i=0;i<dataT.length;i++){
                   if(dataT[i].kpi_id=='I_04000072'){
                     _this.neibushangjishu=dataT[i].year_complete
                   }else if(dataT[i].kpi_id=='I_04000076'){
                     _this.neibushangjijine=dataT[i].year_complete
                     xinshuzu.push({name:'内部商机',value:dataT[i].year_complete})
                   }else if(dataT[i].kpi_id=='I_04000064'){
                     _this.waibushangjishu=dataT[i].year_complete
                   }else if(dataT[i].kpi_id=='I_04000068'){
                     _this.waibushangjijine=dataT[i].year_complete
                     xinshuzu.push({name:'外部商机',value:dataT[i].year_complete})
                   }
          }
   
          alert(JSON.stringify(xinshuzu))
   //        if(this.$echarts.getInstanceByDom(this.$refs.Business_ji)){
   //          this.$echarts.getInstanceByDom(this.$refs.Business_ji).dispose();
   //        }
           let  myChart = this.$echarts.init(this.$refs.Business_ji)
   
           let option = {
   //          color:['#FD9D67', '#FED350', '#A9D3FE', '#8FD3DE', '#A9D371', '#85E1CA', '#E7BD81', '#DBB1E1'],
             color:['#FED350', '#59CA92'],
             title:{
   //            text:zongrenhus+"人"+"\n"+"员工总数",
               x:"center",
               y:"center",
               textStyle:{
                 fontSize:"28px",
                 color:"rgb(88,88,88)",
               },
             },
             tooltip: {
               confine:true,
               show:false,
               trigger: 'item',
               formatter: "{b}:{d}%"
             },
             legend: {
               data:['教育事业','环保事业','赈灾扶贫','其他公益事业'],
               bottom: 0,
               left: 'center',
             },
             series: [
               {
                 type: 'pie',
                 avoidLabelOverlap:true,
                 clockwise:false,
                 silent: true,
   //              radius: ["20%","38%"],
   //              center: ['50%', '50%'],
                 radius: ["45%","65%"],
                 center: ['50%', '50%'],
   //              minAngle:10,
                 labelLine:{
                   show:true,
                   length2:28
   //                length:10,
   //                length2:5
                 },
                 label: {
                   normal: {
                     show: false,
   //                  formatter:function (params) {
   //                    let name = params.name;
   //                    let tmp = "";
   //                    if(name.length <= 5)
   //                      tmp = name;
   //                    else {
   //                      if(name.length > 5){
   //                        tmp += name.substring(0,4) + "\n";
   //                        name = name.substring(4)
   //                      }
   //                      tmp += name;
   //                    }
   //                    return tmp +"\n"+params.percent+"%"+"\n"+params.value+'个'
   //                  },
                   },
                   emphasis: {
                     show: false,
                     textStyle: {
                       fontSize: '10',
                       fontWeight: 'bold'
                     }
                   }
                 },
                  itemStyle: {
                    normal: {
                      color: function (p){
                        if ( p.name == "外部商机" ) {
                          return "#59CA92";
                        } else if ( p.name == "内部商机" ) {
                          return "#FED350";
                        }
                      }
                    }
                  },
                 data:xinshuzu
               }
             ]
           };
          alert(JSON.stringify(option.series[0].data))
           myChart.setOption(option);
           alert(JSON.stringify(myChart.getOption()))
   
           $(window).resize(function () {
             myChart.resize();
           })
         },
   ```
   
   
   
   
   ### Other comments [其他信息]
   <!-- For example: Screenshot or Online demo -->
   <!-- [例如,截图或线上实例 (JSFiddle/JSBin/Codepen)] -->
   
   

----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on GitHub and use the
URL above to go to the specific comment.
 
For queries about this service, please contact Infrastructure at:
users@infra.apache.org


With regards,
Apache Git Services

---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@echarts.apache.org
For additional commands, e-mail: dev-help@echarts.apache.org