openlayers3中如何叠加png图片

概述

本文讲述如何在OL3中叠加展示PNG图片。

实现思路

在OL3中，可通过ImageStatic资源来添加展示一个PNG图片，代码如下：

		image = new ol.layer.Image({
	            source: new ol.source.ImageStatic({
	               url: "img/china2.png",
	               imageExtent: extent
	            })
	        })

在此过程中，需要注意PNG图片的四至，即最大/最小经纬度，例如图片的四至信息如下：

openlayers3中如何叠加png图片

代码中，定义extent的时候，extent的定义如下：

var extent = [63.9796331669, 14.7451916711, 140.1812559169, 55.4673388687];

实现后如下：

openlayers3中如何叠加png图片

实现代码

-------------------------------------------------------------------------------------------------------------

技术博客

CSDN：http://blog.csdn.NET/gisshixisheng

博客园：http://www.cnblogs.com/lzugis/

在线教程

http://edu.csdn.Net/course/detail/799

Github

https://github.com/lzugis/

联系方式

q q:1004740957

e-mail:niujp08@qq.com

公众号:lzugis15

Q Q 群:452117357(webgis)

337469080(Android)