首页 新闻 搜索 专区 学院

echarts饼形图在div中所占面积偏大,如下图。其实div的实际width没那么大,求大神指点!!

0
悬赏园豆:10 [已关闭问题] 关闭于 2016-10-28 09:14

复制代码
<div style="float:left;border:1px solid #d9e6f1;width:570px;height:200px;display:inline">
                <div id="sty3" class="cs1"><img src="<%=basePath%>newPictures/icon/module3.png"/>&nbsp;问题统计
                    <div>
                        <input id="week" name="week" type="button" value="近一周" onclick="clickButton(document.getElementById('week'),document.getElementById('month'))" style="border:0px;height:20px;width:55px;left:555px;position:absolute;top:413px;background-color:white;cursor:pointer"/>
                        <input id="month" name="month" type="button" value="近一月" onclick="clickButton(document.getElementById('month'),document.getElementById('week'))" style="border:0px;height:20px;width:55px;left:610px;position:absolute;top:413px;background-color:#ebf2f8;cursor:pointer"/>
                    </div>
                </div>
                <div id="sty2">
                    <div id="huan" style="float:left;width:160px;height:160px;">                        
                    </div>
                    <div id="kuang" style="float:right;border:1px solid #d9e6f1;width:250px;height:140px;">
</div>
</div>
</div>

<script type="text/javascript">
        var myChart = echarts.init(document.getElementById('huan'));
       var option =({
            title: {
                   text: '总条数',
                   textStyle: {
                       fontSize:'20px',
                       color:'#f39b4d'
                       },                      
                   subtext: ['近一周\n'],
                   subtextStyle:{
                        fontSize:'18px',
                        color: '#003366'
                       },
                   /*itemGap:'50px',*/
                   x: '68px',
                   y: 'center'
                   },
            tooltip: {
                trigger: 'item',
                padding:'10',
                formatter: "{a} <br/>{b}: {c} ({d}%)"
                        },
            legend: {
                orient: 'horizontal',
                x: '20px',
                data:['未解决问题','已解决问题']                
                },
               color:['#969696','#f39b4d'],
            series: [
                {
                    name:'访问来源',
                    type:'pie',
                    radius: ['55%', '80%'],
                    avoidLabelOverlap: false,
                    center:['35%','55%'],
                    label: {
                        normal: {
                            show: false,
                            position: 'center'
                        },
                        emphasis: {
                            show: true,
                            textStyle: {
                                fontSize: '0',
                                fontWeight: 'bold'
                            }
                        }
                    },
                    labelLine: {
                        normal: {
                            show: false
                        }
                    },
                    data:[
                        {value:310, name:'未解决问题'},
                        {value:605, name:'已解决问题'}
                       
                        ]
                }
            ]
            
        });
         myChart.setOption(option);
        </script>
复制代码

 

 

北丐的主页 北丐 | 初学一级 | 园豆:99
提问于:2016-10-21 08:55
< >
分享
所有回答(2)
0

你设的160px

jello chen | 园豆:7096 (大侠五级) | 2016-10-21 10:56

我就是想让它整体的width是160px;

我查看了一下源代码,图形自己本身的div宽度是300px,请问大侠,我可以有什么办法把它变小吗?

 

支持(0) 反对(0) 北丐 | 园豆:99 (初学一级) | 2016-10-21 11:01

@河流小鱼儿: 你的kuang的宽都有变化,说明是你的外部样式,有一处影响到了这里的样式。

支持(0) 反对(0) 授之以渔 | 园豆:1076 (小虾三级) | 2016-10-21 15:44

@授之以渔: 请问有办法修改吗

支持(0) 反对(0) 北丐 | 园豆:99 (初学一级) | 2016-10-21 15:47

@河流小鱼儿: 额,这么我也看不出来。

支持(0) 反对(0) 授之以渔 | 园豆:1076 (小虾三级) | 2016-10-21 16:38
0

额,这么我也看不出来。

授之以渔 | 园豆:1076 (小虾三级) | 2016-10-21 16:38
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册