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 解决这些问题, ...
随机推荐
- A Funny Game——打表&&找规律
题目 n枚硬币排成一个圈.Alice和Bob轮流从中取一枚或两枚硬币.不过,取两枚时,所取的两枚硬币必须是连续的.硬币取走之后留下空格,相隔空格的硬币视为不连续.Alice开始先取,取走最后一枚硬币的 ...
- 2019 Nowcoder Multi-University Training Contest 1 H-XOR
由于每个元素贡献是线性的,那么等价于求每个元素出现在多少个异或和为$0$的子集内.因为是任意元素可以去异或,那么自然想到线性基.先对整个集合A求一遍线性基,设为$R$,假设$R$中元素个数为$r$,那 ...
- Pandas模块 --- 字符与日期型数据的处理
1,pd.to_datetime( 要转换的日期, format= ), 2,pd.to_datetime.today( ).year ,pd.to_datetime.now( ).year 3,字 ...
- canal简单安装使用
canal简介:https://github.com/alibaba/canal 1.数据库配置 首先使用canal需要修改数据库配置 [mysqld] log-bin=mysql-bin # 开启 ...
- C# 全角半角字符互转
/// <summary> /// 全角空格为12288,半角空格为32 /// 其他字符半角(33-126)与全角(65281-65374)的对应关系是:均相差65248 /// < ...
- div模拟textarea且高度自适应
需求 我们知道文本超出 textarea 高度后,textarea 就会出现滚动条,需求就是让 textarea 高度跟随文本高度变化,屏蔽滚动条,原来做过用js去监听文本行数,然后改变文本框的高度, ...
- linux 排查cpu负载过高异常
步骤一.找到最耗CPU的进程 工具:top 方法: 执行top -c ,显示进程运行信息列表 键入P (大写p),进程按照CPU使用率排序 图示: 如上图,最耗CPU的进程PID为10765 步骤二: ...
- Hotspot对象的内存布局
对象头 class oopDesc { ... private: volatile markOop _mark; union _metadata { Klass* _klass; narrowKlas ...
- js传对象处理
JSON.stringify(carlist); 需要先将对象进行处理:如果服务端解析异常,可以先将这个值单独解析一次
- Java: Java终止线程的几种方式
首先说明,使用stop方法终止的方式已经在很久之前就被废弃了,在加锁的情况下有可能会造成死锁,这里不做讨论. 1. 使用标志位终止线程 在run()方法执行完毕后,该线程就终止了.但是在某些特殊的情况 ...