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. whatis - 在 whatis 数据库里查找完整的单词

    总览 (SYNOPSIS) whatis keyword ... 描述 (DESCRIPTION) whatis 命令在一些特定的包含系统命令的简短描述的数据库文件里查找关键字, 然后把结果送到标准输 ...

  2. SQL Injection简介

  3. Linux(二)高级文本处理

    一.cut (cut 命令可以从一个文本文件或者文本流中提取文本列 ) 1.cut语法 cut -d '分隔字符' -f fields         用于有特定分隔字符 cut  -c 字符区间   ...

  4. Delphi 时间函数:关于时间精确的几个函数和方法

    //取毫秒级时间精度(方法一): var t1,t2:int64; r1:int64; begin t1:=GetTickCount;//获取开始计数 WINDOWS API sleep(1000); ...

  5. 判断访问浏览器客户端类型(pc,mac,ipad,iphone,android)

    <script type="text/javascript"> //平台.设备和操作系统 var system = { win: false, mac: false, ...

  6. Oracle实现行转列+Mybatis

    1.需求 报表需要动态展示某几个公司分别在几个月内销售额情况(前端表头月份是动态的,月时间段是前端参数来选择的,最大为12个月), 页面展示如下 Oracle数据库中数据如下: 可以看到一个公司的月份 ...

  7. 一张图看懂阿里云网络产品【十五】IPv6 解决方案

    摘要: 作为国内首家全面支持IPv6的云厂商,阿里云12月再次推出全栈IPv6解决方案,核心产品已全面支持,协助客户小时/天级即可完成IPv6 访问.方案成功历经优酷.淘宝.天猫.双十一考验.SLB ...

  8. thinkphp 标签库驱动

    任何一个模板引擎的功能都不可能是为你量身定制的,具有一个良好的可扩展机制也是模板引擎的另外一个考量,Smarty采用的是插件方法来实现扩展,Think\Template由于采用了标签库技术,比Smar ...

  9. C++的new和delete

    #include <iostream> using namespace std; int main(int argc, char *argv[]) { int *p = NULL; //定 ...

  10. SPSS单一样本的T检验

    SPSS单一样本的T检验 如果已知总体均数,进行样本均数与总体均数之间的差异显著性检验属于单一样本的T检验.在SPSS中,单一样本的T检验由"One-Sample T Test"过 ...