var echartsWarp= document.getElementById('echartsWarp');

var resizeWorldMapContainer = function ()

{

  //用于使chart自适应高度和宽度,通过窗体高宽计算容器高宽

  echartsWarp.style.width = window.innerWidth+'px';

  echartsWarp.style.height = window.innerHeight+'px';

};

resizeWorldMapContainer ();//设置容器高宽

window.onresize = function ()

{

  //用于使chart自适应高度和宽度

  resizeWorldMapContainer();//重置容器高宽

  myChart.resize();

};

js 自适应容器宽高的更多相关文章

  1. 容器宽高不确定,图片宽高不确定,css如何实现图片响应式?

    图片响应式 在响应式开发中最烦恼的应该就是图片了,虽然图片设置max-width: 100%;可以让图片宽度占满容器,但是高度就不能自适应了.如果将容器高度限死,那么我们就要使用媒体查询来控制容器的高 ...

  2. js实现未知宽高的元素在指定元素中垂直水平居中

    js实现未知宽高的元素在指定元素中垂直水平居中:本章节介绍一下如何实现未知宽高的元素在指定元素下实现垂直水平居中效果,下面就以span元素为例子,介绍一下如何实现span元素在div中实现水平垂直居中 ...

  3. js实现字体和容器宽高随窗口改变

    用于字体大小和容器的宽高字体和宽高设为rem就可以了 var html = document.documentElement; function fonts(){ var hW = html.offs ...

  4. js动态添加iframe,自适应页面宽高

    function showIframe(url,w,h){ //添加iframe var if_w = w; var if_h = h; $("<iframe width='" ...

  5. JS实现图片宽高的等比缩放

    关于图片宽高的等比缩放,其实需求就是让图片自适应父容器的宽高,并且是等比缩放图片,使图片不变形. 例如,需要实现如下的效果: 要实现上面的效果,需要知道图片的宽高,父容器的宽高,然后计算缩放后的宽高. ...

  6. js获取各种宽高方法

    屏幕的有效宽高: window.screen.availHeightwindow.screen.availWidth 网页可见区域宽:document.body.clientWidth 网页可见区域高 ...

  7. JS获取网页宽高方法集合

    JS获取网页宽高等方法的集合:document.body.clientWidth - 网页可见区域宽document.body.clientHeight - 网页可见区域高 document.body ...

  8. JS/jQ常用宽高及应用

    关于js的宽高,随便一搜就是一大堆.这个一大堆对我来说可不是什么好事,看的头都大了.所以今天就总结了一些比较会常用的,并说明一下应用场景. 先来扯一下documentElement和body的微妙关系 ...

  9. React组件自适应窗口宽高

    很多时候我们需要组件能够根据窗口变化改变宽高,有时候可以使用css,有时候需要随数据调整则使用js计算. 比如说,当我们在页面中放置一个iframe时,我们希望它的宽高随着其父元素or窗口的变化而变化 ...

随机推荐

  1. 基于nginx结合openssl实现https

    [root@localhost ~]#systemctl stop firewalld[root@localhost ~]#setenforce 0[root@localhost ~]#iptable ...

  2. 文件上传到ftp服务工具类

    直接引用此java工具类就好 import java.io.File; import java.io.FileInputStream; import java.io.FileNotFoundExcep ...

  3. [转]mybatis-generator 代码自动生成工具(maven方式)

    由于MyBatis属于一种半自动的ORM框架,所以主要的工作将是书写Mapping映射文件,但是由于手写映射文件很容易出错,mybatis-gennerator插件帮我们自动生成mybatis所需要的 ...

  4. 使用CGIHTTPServer搭建简单网站

    目录 一.前提准备 二.搭建web网站 如何快速搭建web网站?这个问题对于我这样的小白来说简直就是一脸懵逼毫无头绪.在学习python的过程接触到了 CGI 编程,至于CGI是什么?怎么运行的?这我 ...

  5. 【Http】keepalive

    http是现在web领域极其普遍的应用层传输协议, 目前常见的使用版本则是http1.1, 当然最先版本是http2.0. 传统的Http应用里都是一次TCP连接一次request.   image ...

  6. css美化checkbox的样式

    使用iCheck插件可以改变checkbox.radio的原有样式,但是改变的样式尺寸有些大修改起来也比较麻烦,并且需要使用iCheck的调用方法才能使用,有时候iCheck方法还会覆盖掉同级元素的c ...

  7. NX二次开发-UFUN拾取向量对话框UF_UI_specify_vector

    #include <uf.h> #include <uf_ui.h> UF_initialize(); //拾取向量对话框 ], pnt[]; int mode = UF_UI ...

  8. 阿里云ecs(phpstudy一件包)

            选择语言       保存并连接    Linux硬盘挂载是比较常见的管理操作之一.默认情况下数据盘没有挂载,需要手动挂载到系统中.     具体操作是分三步:     硬盘挂载1)需 ...

  9. [14]APUE:API for Mysql

    库:/usr/lib64/libmysqlclient.so.#.#... 头文件:/usr/lib64/mysql/mysql.h 一.建立连接 MYSQL *mysql_init(MYSQL *) ...

  10. cv2.imwrite()指定图片存储路径

    cv2.imwrite("./data/photo_{}.jpg".format(i), photo)