ECharts 避免变窄
var roomPercentChart = echarts.init(document.getElementById('room_percent'));
function ajaxGetRoomPercent() {
// 基于准备好的dom,初始化echarts实例
$.ajax({
url: "ajaxGetRoomPercent",
data: {},
type: "POST",
dataType: "json",
success: function (res) {
// 指定图表的配置项和数据
var option = {
tooltip: {
formatter: "{a} <br/>{b} : {c}%"
},
series: [
{
name: '房间使用量',
type: 'gauge',
detail: {formatter: '{value}%'},
data: [{value: res.data, name: '已使用'}]
}
]
};
// 使用刚指定的配置项和数据显示图表。
roomPercentChart.setOption(option,true);
}
});
}
// 避免尺寸变窄
setInterval(function () {
if ($("#room_percent").width() != $("#room_percent canvas").width() && $("#room_percent canvas").width() < $("#room_percent").width()) {
// myChart.resize();
roomPercentChart.resize();
}
}, 100);
ajaxGetRoomPercent();
myChart.resize();
定时检查宽度,如果不一致,并且太小的话,就resize重置一下。
ECharts 避免变窄的更多相关文章
- echarts数据变了不重新渲染,以及重新渲染了前后数据会重叠渲染的问题
1.echarts数据变了但是视图不重新渲染 新建Chart.vue文件 <template> <p :id="id" :style="style&q ...
- PN结加正向偏置电压 其空间电荷区为何变窄
理论基础:导体是内部具有较多可以自由移动的电荷的物体. 绝缘体是内部没有或者有很少可以自由移动的电荷的物体. +代表空穴带正电 -代表电子带负电 两竖线之间表示无自由移动电子或空穴部分,相当于绝缘体 ...
- war 宽度变窄
1.打开开始菜单-运行-输入Regedit 打开注册表编辑器 展开 HKEY_CURRENT_USER 继续展开 Software继续展开 Blizzard Entertainment 在Warcra ...
- [改善Java代码]警惕泛型是不能协变和逆变的
什么叫做协变(covariance)和逆变(contravariance)? 在变成语言的类型框架中,协变和逆变是指宽类型和窄类型在某种情况下(如参数,泛型,返回值)替换或交换的特性,简单的说,协变是 ...
- MUI - 解决弹出输入法时页面高度变小导致底部上浮的问题
解决弹出输入法时页面高度变小导致底部上浮的问题 在有输入框的页面,当输入法弹出的时候,底部元素上浮遮盖了输入框,影响页面美观及功能.查找了一下,页面变窄是不可避免的.即使是设置绝对固定也是不可以的.因 ...
- webpack打包性能优化
1. 使用 gzip 压缩打包后的 js 文件 这个方法优化浏览器下载时的文件大小(打包后的文件大小没有改变) webpack.config.prod.js 中 var CompressionWebp ...
- 界面设计技法之css布局
css布局之于页面就如同ECMAScript之于JS一般,细想一番,html就如同语文,css就如同数学,js呢,就是物理,有些扯远,这里就先不展开了. 回到主题,从最开始的css到如今的sass(l ...
- CSS 3 学习——transform 3D转换渲染
以下内容根据官方规范翻译,没有翻译关于SVG变换的内容和关于矩阵计算的内容. 一般情况下,元素在一个无景深无立体感的平面(flat plane)上渲染,这个平面就是其包含块所处的平面.同时,页面上的其 ...
- 前端精选文摘:BFC 神奇背后的原理
BFC 已经是一个耳听熟闻的词语了,网上有许多关于 BFC 的文章,介绍了如何触发 BFC 以及 BFC 的一些用处(如清浮动,防止 margin 重叠等).虽然我知道如何利用 BFC 解决这些问题, ...
随机推荐
- day002-Linux基础之常用基本命令讲解
Linux系统一切皆命令 命令1:pwd 显示当前所在目录命令2:cd(change directory) 切换目录 cd / 回到根目录 cd .. 返回上一级命令3:ls 查看当前目录下的文件 l ...
- linux学习11 Linux基础命令及命令历史
一.Linux系统上的文件类型 1.- :常规文件:在其它程序中用f表示.比如我们用ls -l命令查看的第一个内容 [root@localhost ~]# ls -l total -rw------- ...
- python自动化测试学习目录
一.python学习目录 <1> ----python驱动 [python驱动]python进行selenium测试时GeckoDriver放在什么地方? python下浏览器静默运行驱动 ...
- 【AtCoder】 ARC 098
link C-Attention 题意:一个字符队列,每个位置是\(W\)或\(E\),计算最小的修改数量,使得存在一个位置,它之前的都是\(E\),之后的都是\(F\) #include<bi ...
- Mysql与Postgresql常用命令比较
PostgreSQL MySQL 服务启动:1)#service postgresql start2)#/etc/init.d/postgresql start3)#su – postgresql$p ...
- HustOJ二次开发之修改数据库连接池
有的时候我们会因为某种业务需要的情况下,需要修改hustoj默认的数据库连接池之类的. 修改数据库连接池步骤 进入到对应的目录 /home/judge/src/web/include 找到db_inf ...
- java基础 小知识点汇总篇
1.&和&& |和|| 的区别? a&b,会执行a,执行b ,得出结论 a&&b,会执行a,如果a false,则不执行b,直接返回false 2.Ma ...
- vi 调到第一行和最后一行
gg 跳到文件第一行Shift + g 跳到文件最后一行 chmod 777 abc.txt
- 《JAVA程序设计》_第十一周学习总结
一.学习内容 13.1 URL类 URL类是java.net包中的一个重要的类,URL的实例封装着一个统一资源定位符,使用URL创建对象的应用程序称作客户端程序. 一个URL对象包含的三个基本信息:协 ...
- What is the difference between UNION and UNION ALL?
What is the difference between UNION and UNION ALL? UNION removes duplicate records (where all colum ...