Skip to content
  • 首页
  • GIS理论
  • 二次开发
    • deck.gl
    • leaflet
    • Current Page Parent openlayers
    • mapboxgl
    • 百度地图开发
    • ArcPy
    • ArcEngine
    • geotools
    • QGIS
    • cesium
    • ArcGIS
      • arcgis api for javascript
        • ArcGIS API For JavaScript官方文档
        • 3.x
        • 4.x
      • ArcGISServer
  • 算法
    • GDAL
    • PROJ
    • OGR
    • Geotrellis
  • GIS前沿
    • GIS+BIM
    • GIS人工智能
    • GIS大数据
    • GIS新闻
  • 数据分析
  • 前端
    • JavaScript
    • vue
    • es6
    • CSS
    • html5
  • 后端
    • C#
    • Java
    • redis
    • nodejs
    • Python
      • Python教程
      • Scrapy教程
      • Python数据分析
      • pyspider
  • 操作系统
    • windows
    • centos
    • ubuntu
    • macos
  • 数据库
    • PostGreSQL
    • MongoDB
    • Oracle
      • oraclespatial
    • MySQL
  • GIS数据
    • 数据源
    • ArcMap
    • CAD
    • GeoServer
  • 精选专区
  • 开发工具
  • GIS分析
  • GIS软件
  • 数据中心
  • 源码
  • 登录
  • 注册
  • 版权说明

GIS开发者

gis,openlayers,leaflet,gis应用,geoai,geoserver,cesium,python,arcpy,arcmap,webgis,gis可视化

  • 首页
  • GIS理论
  • 二次开发
    • deck.gl
    • leaflet
    • Current Page Parent openlayers
    • mapboxgl
    • 百度地图开发
    • ArcPy
    • ArcEngine
    • geotools
    • QGIS
    • cesium
    • ArcGIS
      • arcgis api for javascript
        • ArcGIS API For JavaScript官方文档
        • 3.x
        • 4.x
      • ArcGISServer
  • 算法
    • GDAL
    • PROJ
    • OGR
    • Geotrellis
  • GIS前沿
    • GIS+BIM
    • GIS人工智能
    • GIS大数据
    • GIS新闻
  • 数据分析
  • 前端
    • JavaScript
    • vue
    • es6
    • CSS
    • html5
  • 后端
    • C#
    • Java
    • redis
    • nodejs
    • Python
      • Python教程
      • Scrapy教程
      • Python数据分析
      • pyspider
  • 操作系统
    • windows
    • centos
    • ubuntu
    • macos
  • 数据库
    • PostGreSQL
    • MongoDB
    • Oracle
      • oraclespatial
    • MySQL
  • GIS数据
    • 数据源
    • ArcMap
    • CAD
    • GeoServer
  • 精选专区
  • 开发工具
  • GIS分析
  • GIS软件
  • 数据中心
  • 源码
  • openlayers

利用zoom 实现不同分辨率展示

by giser · 2019-04-03

目录

  • 核心方法
  • 调用


注意:此zoom 直接添加到body上,所以整个内容都会缩放(谨慎使用)

核心方法

function getWindowSize(){
	let windowWidth=$(window).width();
	let windowHeigh=$(window).height();
	if(!detectIE()){ //detectIE() 判断是否是ie,自行百度方法
		if(windowWidth<=900){
			windowWidth=900;
			$('body').css({'width':documentWidth});	
		}
		zoomScale=windowWidth/documentWidth;
		$('body').css({'zoom':zoomScale});
	}else{
		zoomScale=1;
		windowWidth=1900;
	}
}

调用

getWindowSize();
$(window).bind('resize',function(){getWindowSize()});

转载自:https://blog.csdn.net/qq_37026254/article/details/88708080

Tags: openlayers

  • Next story openlayer3 系列 2 – 加载 arcgis server 图层
  • Previous story JS文件的格式化

You may also like...

  • (笔记3)空间数据的加载与显示

    2019-04-03

  • OpenLayers源码学习(一) 取图算法

    2019-04-03

  • OpenLayers学习——事件注册

    2019-04-03

公众号

微信群

人数过多只能拉人进群;

加我好友yu389741

微信小程序

GIS开发者
京ICP备 18040113号
  • CSDN
  • GeoAI
  • 中国程序员
  • 博客园
  • 站点地图
  • 吾爱地理
  • 地理导航

GIS开发者 © 2026. All Rights Reserved.

Powered by WordPress. Theme by Alx.