weixin_39053691 2017-09-08 09:40 采纳率: 0%
浏览 1974
已结题

echarts 仪表盘 中 数值会因电脑屏幕分辨率不同被遮挡,求解决

![图片说明](https://img-ask.csdn.net/upload/201709/08/1504863517_853418.png)图片说明

this.doEchartYb=function(value){

         option = {
             title: {
                 text: "余额价值比:",
                 x: 'left',
                 textStyle: {
                     fontSize: 14
                 }
             },
             tooltip: {
                 //formatter: "{a} <br/>{b} : {c}%"
                 formatter: "{a} : {c}"
             },
             toolbox: {
                 show: false,
                 feature: {
                     mark: {show: true},
                     restore: {show: true},
                     saveAsImage: {show: true}
                 }
             },
             series: [
                 {
                     name: '余额价值比',
                     type: 'gauge',
                     center: ['50%', '50%'],    // 默认全局居中
                     radius: [0, '70%'],
                     startAngle: 140,
                     endAngle: -140,
                     min: 0,                     // 最小值
                     max: 1,                   // 最大值
                     precision: 0,               // 小数精度,默认为0,无小数点
                     splitNumber: 10,             // 分割段数,默认为5
                     axisLine: {            // 坐标轴线
                         show: true,        // 默认显示,属性show控制显示与否
                         lineStyle: {       // 属性lineStyle控制线条样式
                             color: [[0.4, 'skyblue'], [0.8, 'orange'], [1, '#ff4500']],
                             width: 30
                         }
                     },
                     axisTick: {            // 坐标轴小标记
                         show: true,        // 属性show控制显示与否,默认不显示
                         splitNumber: 2,    // 每份split细分多少段
                         length: 8,         // 属性length控制线长
                         lineStyle: {       // 属性lineStyle控制线条样式
                             color: '#eee',
                             width: 1,
                             type: 'solid'
                         }
                     },
                     axisLabel: {           // 坐标轴文本标签,详见axis.axisLabel
                         show: true,
                         formatter: function (v) {
                             switch (v + '') {
                                 //case '10': return '弱';
                                 // case '0.2': return '弱';
                                 case '0.2':
                                     return '低';
                                 case '0.6':
                                     return '中';
                                 case '0.9':
                                     return '高';
                                 default:
                                     return '';
                             }
                         },
                         textStyle: {       // 其余属性默认使用全局文本样式,详见TEXTSTYLE
                             color: '#333'
                         }
                     },
                     splitLine: {           // 分隔线
                         show: true,        // 默认显示,属性show控制显示与否
                         length: 30,         // 属性length控制线长
                         lineStyle: {       // 属性lineStyle(详见lineStyle)控制线条样式
                             color: '#eee',
                             width: 2,
                             type: 'solid'
                         }
                     },
                     pointer: {
                         length: '80%',
                         width: 8,
                         color: 'auto'
                     },
                     title: {
                         show: true,
                         offsetCenter: ['-65%', 10],       // x, y,单位px
                         textStyle: {       // 其余属性默认使用全局文本样式,详见TEXTSTYLE
                             color: '#333',
                             fontSize: 15
                         }
                     },
                     detail: {
                         show: true,      /////
                         backgroundColor: 'rgba(0,0,0,0)',
                         borderWidth: 0,
                         borderColor: '#ccc',
                         width: 100,
                         height: -218,
                         offsetCenter: [0, '10%'],       // x, y,单位px
                         formatter: '{value}',
                         textStyle: {       // 其余属性默认使用全局文本样式,详见TEXTSTYLE
                             color: 'auto',
                             fontSize: 20
                         }
                     },
                     data: [{value: 0.2, name: ''}]   //默认样式name:余额价值比
                 }
             ]
            };

            option.series[0].data[0].value= value;
            var SaleChart = echarts.init(dojo.byId("sdt"));//emap result
            SaleChart.setOption(option);
     };
  • 写回答

2条回答

  • JHCan333 2017-09-08 09:48
    关注

    是detail被挡住了么?

    评论

报告相同问题?

悬赏问题

  • ¥50 随机森林与房贷信用风险模型
  • ¥50 buildozer打包kivy app失败
  • ¥30 在vs2022里运行python代码
  • ¥15 不同尺寸货物如何寻找合适的包装箱型谱
  • ¥15 求解 yolo算法问题
  • ¥15 虚拟机打包apk出现错误
  • ¥15 用visual studi code完成html页面
  • ¥15 聚类分析或者python进行数据分析
  • ¥15 三菱伺服电机按启动按钮有使能但不动作
  • ¥15 js,页面2返回页面1时定位进入的设备