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 避免变窄的更多相关文章

  1. echarts数据变了不重新渲染,以及重新渲染了前后数据会重叠渲染的问题

    1.echarts数据变了但是视图不重新渲染 新建Chart.vue文件 <template>  <p :id="id" :style="style&q ...

  2. PN结加正向偏置电压 其空间电荷区为何变窄

    理论基础:导体是内部具有较多可以自由移动的电荷的物体. 绝缘体是内部没有或者有很少可以自由移动的电荷的物体. +代表空穴带正电 -代表电子带负电 两竖线之间表示无自由移动电子或空穴部分,相当于绝缘体 ...

  3. war 宽度变窄

    1.打开开始菜单-运行-输入Regedit 打开注册表编辑器 展开 HKEY_CURRENT_USER 继续展开 Software继续展开 Blizzard Entertainment 在Warcra ...

  4. [改善Java代码]警惕泛型是不能协变和逆变的

    什么叫做协变(covariance)和逆变(contravariance)? 在变成语言的类型框架中,协变和逆变是指宽类型和窄类型在某种情况下(如参数,泛型,返回值)替换或交换的特性,简单的说,协变是 ...

  5. MUI - 解决弹出输入法时页面高度变小导致底部上浮的问题

    解决弹出输入法时页面高度变小导致底部上浮的问题 在有输入框的页面,当输入法弹出的时候,底部元素上浮遮盖了输入框,影响页面美观及功能.查找了一下,页面变窄是不可避免的.即使是设置绝对固定也是不可以的.因 ...

  6. webpack打包性能优化

    1. 使用 gzip 压缩打包后的 js 文件 这个方法优化浏览器下载时的文件大小(打包后的文件大小没有改变) webpack.config.prod.js 中 var CompressionWebp ...

  7. 界面设计技法之css布局

    css布局之于页面就如同ECMAScript之于JS一般,细想一番,html就如同语文,css就如同数学,js呢,就是物理,有些扯远,这里就先不展开了. 回到主题,从最开始的css到如今的sass(l ...

  8. CSS 3 学习——transform 3D转换渲染

    以下内容根据官方规范翻译,没有翻译关于SVG变换的内容和关于矩阵计算的内容. 一般情况下,元素在一个无景深无立体感的平面(flat plane)上渲染,这个平面就是其包含块所处的平面.同时,页面上的其 ...

  9. 前端精选文摘:BFC 神奇背后的原理

    BFC 已经是一个耳听熟闻的词语了,网上有许多关于 BFC 的文章,介绍了如何触发 BFC 以及 BFC 的一些用处(如清浮动,防止 margin 重叠等).虽然我知道如何利用 BFC 解决这些问题, ...

随机推荐

  1. oc语言源代码

    ? https://opensource.apple.com/source/objc4/objc4-493.9/runtime/

  2. Linux yum 包 下载地址

    yum包网址: http://www.rpmfind.net/linux/rpm2html/search.php?query=yum

  3. ent 基本使用 一 schema 迁移

    ent 是 facebook 开源的golang orm 框架,简单强大,以下是一个简单使用 环境准备 安装ent 工具 go get github.com/facebookincubator/ent ...

  4. 怎么把ubuntu升级到最新版本

    首先是Ctrl+Alt+T 打开终端,然后在终端中输入指令(更新资源) sudo apt-get update 接着是对软件进行升级.(这是一个漫长的过程,需要下载资源) sudo apt-get u ...

  5. luoguP4721 【模板】分治 FFT

    P4721 [模板]分治 FFT 链接 luogu 题目描述 给定长度为 \(n-1\) 的数组 \(g[1],g[2],..,g[n-1]\),求 \(f[0],f[1],..,f[n-1]\),其 ...

  6. Tomcat8.x的安装与启动

    Tomcat是企业网站的服务器,大多都用于中.小型网站开发和学习开发JSP应用程序中.笔者也是开始学习,下面介绍Tomcat8.x的安装步骤. 进入Tomcat官网,点击左边的download目录下的 ...

  7. shell 空语句

    在shell脚本中“:”是空命令,表示什么都不做类似于python中的pass

  8. 20175211 《实验三 敏捷开发与XP实践》实验报告

    目录 一.实验内容 二.实验步骤 四.实验过程中遇到的问题及其解决方法 五.心得体会 六.码云链接 七.结对成员链接 八.参考资料 一.实验内容 (1)编码标准 (2)Git的使用 (3)重构 (4) ...

  9. 【MonkeyRunner】[技术博客]用python编写脚本查看设备信息

    [MonkeyRunner]用python编写脚本查看设备信息 原以为是个简单的操作,在实践的时候发现了一些问题. python脚本 test.py: from com.android.monkeyr ...

  10. Linux上DNS解析总是选择resolv.conf中第二位的DNS服务器IP地址

    问题现象: 在Linux机器上,用户自建了一台DNS服务器.然后改动/etc/resolv.conf将其服务器IP地址添加到第一项.将阿里云的内网DNS放到第二位,然而在测试过程中发现telnet,p ...