You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by GitBox <gi...@apache.org> on 2021/03/26 06:31:57 UTC

[GitHub] [echarts] sandm1227 opened a new issue #14536: android8 【itemStyle-color-image】 is Script error

sandm1227 opened a new issue #14536:
URL: https://github.com/apache/echarts/issues/14536


   ### Version
   5.0.2
   
   ### Steps to reproduce
   
   import * as echarts from 'echarts/core';
   import {
       GaugeChart
   } from 'echarts/charts';
   import {
       CanvasRenderer
   } from 'echarts/renderers';
   echarts.use(
       [GaugeChart, CanvasRenderer]
   );
   
   mounted() {
           this._initEcharts();
       },
   
   method: {
   _initEcharts() {
         const chartDom = this.$refs.echartsDom;
               const imagDom = this.$refs.processPic;
               this.myChart = chartDom && echarts.init(chartDom);
        
   this.chartOption = {
       series: [{
           z: 3,
           type: 'gauge',
           center: ["50%", "50%"],
           radius: '98%',
           min: 0,
           max: 1000,
           detail: {
               valueAnimation: true,
               formatter:'{value}%',
               color: '#00BA38',
               fontFamily: 'PingFangSC-Regular',
               fontSize: '30',
               offsetCenter: [0, 0]
           },
            title: {
               color: '#00BA38',
               fontFamily: 'PingFangSC-Regular',
               fontSize: '12',
               offsetCenter: [0, '-30%']
           },
           startAngle:212,
           endAngle:-32,
           data: [{value: 1000, name: '我的薪资'}],
           axisLine: {				// 仪表盘轴线(轮廓线)相关配置。
               show: false,				// 是否显示仪表盘轴线(轮廓线),默认 true。
           },
           axisTick: {show: false},
           axisLabel: {show: false},
           pointer: {show: false},	
           splitLine: {
               show: false,
           },
           progress: {
               show: true,
               width: 24
           },
           itemStyle: {
               color: {
                   image: imagDom,
                   repeat: 'no-repeat'
               },
           }
       },
       {
           name: '业务指标2',
           type: 'gauge',
           center: ['50%', '50%'], 
           radius: '98%',
           detail:{show:false},// {formatter: '{value}'},
           startAngle:212,
           endAngle:-32,
           axisLine: {				// 仪表盘轴线(轮廓线)相关配置。
                   show: true,				// 是否显示仪表盘轴线(轮廓线),默认 true。
                   lineStyle: {			// 仪表盘轴线样式。
                   color: [[0,'pink'],[1,'#DEDBD7']],
                   width: 24,					//轴线宽度,默认 30。
                   shadowColor: "#fff",		//阴影颜色。支持的格式同color。
               }
           },
           splitLine: {
               show: false,
           },
           axisTick: {
               show: false
           },
           axisLabel: {show: false},
           pointer: {show: false},	
       }
       ]
   }
   // 绘制图表
   this.myChart.setOption(this.chartOption);
   }
             
   }
   
   <div class="respage-infoBox-topRight-echarts" id="echartsDom" ref="echartsDom"></div>
   <img src="@/assets/表盘-背景色-t.png" ref="processPic" v-show="false" />
   
   ### What is expected?
   android手机上可以image填充
   
   ### What is actually happening?
   android手机上image无法填充,报错Script error
   
   <!-- This issue is generated by echarts-issue-helper. DO NOT REMOVE -->
   <!-- This issue is in English. DO NOT REMOVE -->


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to 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



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


[GitHub] [echarts] sandm1227 commented on issue #14536: android8 【itemStyle-color-image】 is Script error

Posted by GitBox <gi...@apache.org>.
sandm1227 commented on issue #14536:
URL: https://github.com/apache/echarts/issues/14536#issuecomment-809100618


   > 请提供更多信息帮助我们排查问题
   ![image](https://user-images.githubusercontent.com/25194203/112794299-3c3da100-9099-11eb-915c-d3a7c202b3e9.png)
   
   ![image](https://user-images.githubusercontent.com/25194203/112794260-2cbe5800-9099-11eb-835a-57a00d051b31.png)
   


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to 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



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


[GitHub] [echarts] sandm1227 removed a comment on issue #14536: android8 【itemStyle-color-image】 is Script error

Posted by GitBox <gi...@apache.org>.
sandm1227 removed a comment on issue #14536:
URL: https://github.com/apache/echarts/issues/14536#issuecomment-809099518






-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to 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



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


[GitHub] [echarts] echarts-bot[bot] commented on issue #14536: android8 【itemStyle-color-image】 is Script error

Posted by GitBox <gi...@apache.org>.
echarts-bot[bot] commented on issue #14536:
URL: https://github.com/apache/echarts/issues/14536#issuecomment-807974187






-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to 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



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


[GitHub] [echarts] sandm1227 commented on issue #14536: android8 【itemStyle-color-image】 is Script error

Posted by GitBox <gi...@apache.org>.
sandm1227 commented on issue #14536:
URL: https://github.com/apache/echarts/issues/14536#issuecomment-809099893


   
   ![image](https://user-images.githubusercontent.com/25194203/112794146-07c9e500-9099-11eb-812b-4808d35ff872.png)
   


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to 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



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


[GitHub] [echarts] sandm1227 commented on issue #14536: android8 【itemStyle-color-image】 is Script error

Posted by GitBox <gi...@apache.org>.
sandm1227 commented on issue #14536:
URL: https://github.com/apache/echarts/issues/14536#issuecomment-809099518


   ![image](https://user-images.githubusercontent.com/25194203/112794058-e1a44500-9098-11eb-9041-97637427af0b.png)
   
   


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to 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



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


[GitHub] [echarts] pissang closed issue #14536: android8 【itemStyle-color-image】 is Script error

Posted by GitBox <gi...@apache.org>.
pissang closed issue #14536:
URL: https://github.com/apache/echarts/issues/14536


   


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to 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



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


[GitHub] [echarts] sandm1227 commented on issue #14536: android8 【itemStyle-color-image】 is Script error

Posted by GitBox <gi...@apache.org>.
sandm1227 commented on issue #14536:
URL: https://github.com/apache/echarts/issues/14536#issuecomment-809971955


   改成svg渲染模式,可以解决上述问题了。
   ![image](https://user-images.githubusercontent.com/25194203/112947801-d79e4700-9169-11eb-9ce3-47596538b41f.png)
   


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to 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



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


[GitHub] [echarts] echarts-bot[bot] edited a comment on issue #14536: android8 【itemStyle-color-image】 is Script error

Posted by GitBox <gi...@apache.org>.
echarts-bot[bot] edited a comment on issue #14536:
URL: https://github.com/apache/echarts/issues/14536#issuecomment-807974215


   @sandm1227 It seems you are not using English, I've helped translate the content automatically. To make your issue understood by more people, we'd like to suggest using English next time. 🤗
   <details><summary><b>TRANSLATED</b></summary><br>
   
   **BODY**
   
   ### Version
   5.0.2
   
   ### Steps to reproduce
   
   ```js
   import * as echarts from 'echarts/core';
   import {
       GaugeChart
   } from 'echarts/charts';
   import {
       CanvasRenderer
   } from 'echarts/renderers';
   echarts.use(
       [GaugeChart, CanvasRenderer]
   );
   
   mounted() {
       this._initEcharts();
   },
   
   method: {
       _initEcharts() {
           const chartDom = this.$refs.echartsDom;
           const imagDom = this.$refs.processPic;
           this.myChart = chartDom && echarts.init(chartDom);
   
           this.chartOption = {
               series: [{
                       z: 3,
                       type: 'gauge',
                       center: ["50%", "50%"],
                       radius: '98%',
                       min: 0,
                       max: 1000,
                       detail: {
                           valueAnimation: true,
                           formatter: '{value}%',
                           color: '#00BA38',
                           fontFamily: 'PingFangSC-Regular',
                           fontSize: '30',
                           offsetCenter: [0, 0]
                       },
                       title: {
                           color: '#00BA38',
                           fontFamily: 'PingFangSC-Regular',
                           fontSize: '12',
                           offsetCenter: [0, '-30%']
                       },
                       startAngle: 212,
                       endAngle: -32,
                       data: [{
                           value: 1000,
                           name: '我的薪资'
                       }],
                       axisLine: { // 仪表盘轴线(轮廓线)相关配置。
                           show: false, // 是否显示仪表盘轴线(轮廓线),默认 true。
                       },
                       axisTick: {
                           show: false
                       },
                       axisLabel: {
                           show: false
                       },
                       pointer: {
                           show: false
                       },
                       splitLine: {
                           show: false,
                       },
                       progress: {
                           show: true,
                           width: 24
                       },
                       itemStyle: {
                           color: {
                               image: imagDom,
                               repeat: 'no-repeat'
                           },
                       }
                   },
                   {
                       name: '业务指标2',
                       type: 'gauge',
                       center: ['50%', '50%'],
                       radius: '98%',
                       detail: {
                           show: false
                       }, // {formatter: '{value}'},
                       startAngle: 212,
                       endAngle: -32,
                       axisLine: { // 仪表盘轴线(轮廓线)相关配置。
                           show: true, // 是否显示仪表盘轴线(轮廓线),默认 true。
                           lineStyle: { // 仪表盘轴线样式。
                               color: [
                                   [0, 'pink'],
                                   [1, '#DEDBD7']
                               ],
                               width: 24, //轴线宽度,默认 30。
                               shadowColor: "#fff", //阴影颜色。支持的格式同color。
                           }
                       },
                       splitLine: {
                           show: false,
                       },
                       axisTick: {
                           show: false
                       },
                       axisLabel: {
                           show: false
                       },
                       pointer: {
                           show: false
                       },
                   }
               ]
           }
           // 绘制图表
           this.myChart.setOption(this.chartOption);
       }
   
   }
   ```
   
   ```html
   <div class="respage-infoBox-topRight-echarts" id="echartsDom" ref="echartsDom"></div>
   <img src="@/assets/表盘-背景色-t.png" ref="processPic" v-show="false" />
   ```
   
   ### What is expected?
   Android phone can be filled with image
   
   ### What is actually happening?
   The image on the android phone can't be filled in, reporting the wrong Script error
   </details>


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to 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



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


[GitHub] [echarts] pissang commented on issue #14536: android8 【itemStyle-color-image】 is Script error

Posted by GitBox <gi...@apache.org>.
pissang commented on issue #14536:
URL: https://github.com/apache/echarts/issues/14536#issuecomment-807998266


   请提供更多信息帮助我们排查问题


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to 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



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


[GitHub] [echarts] sandm1227 commented on issue #14536: android8 【itemStyle-color-image】 is Script error

Posted by GitBox <gi...@apache.org>.
sandm1227 commented on issue #14536:
URL: https://github.com/apache/echarts/issues/14536#issuecomment-820950370


   ios12.4 也无法使用image填充,console无报错显示


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to 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



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