<body>

    <div id="map"></div>

    <script>

        var extent = [0, 0, 1024, 968];//表示图片的尺寸

        var projection = new ol.proj.Projection({

            code: 'EPSG:3857',

            extent: extent

        });

        var imageLayer = new ol.layer.Image({

            source: new ol.source.ImageStatic({

                url: 'image/online_communities.png',

                projection: projection,

                imageExtent: extent

            })

        });

        var map = new ol.Map({  //初始化map

            target: 'map',

            layers: [

                imageLayer

            ],

            view: new ol.View({

                projection: projection,

                center: ol.extent.getCenter(extent),

                zoom: 2

            })

        });

    </script>

</body>

Openlayers 3 的 imagelayer的更多相关文章

  1. OpenLayers 3 中Layers的相关知识

    昨天自己一遍又一遍的把API里Accessible map那个例子写下来,终于好像有熟悉一点点.找到一篇博文详细讲Layers的.整理一下贴出来(本来想在网上做笔记可以重新排版,比写在本子上要容易有结 ...

  2. openlayers三：添加图片和图标

    openlayers添加图片是指: 添加在地图上的图片会跟随地图同步放大缩小 而添加图标是指: 添加在地图上的图片不会跟随地图同步放大缩小 添加图片: 首先初始化图片图层: initImageLaye ...

  3. 使TileCache配合OpenLayers，产生地图瓦块的一些资料（转）

    在tilecache.cfg中配置好被切割地图的参数,比如: [mytestmap]layers=3,5,7,8type=WMSurl=http://localhost/arcgis/services ...

  4. HTML5 网络拓扑图整合 OpenLayers 实现 GIS 地图应用

    在前面<百度地图.ECharts整合HT for Web网络拓扑图应用>我们有介绍百度地图和 HT for Web 的整合,我们今天来谈谈 OpenLayers 和 HT for Web  ...

  5. OpenLayers.2.10.Beginners.Guide---第一章

    从网上下载openlayers2,解压取得img theme 文件夹和openlayes.js文件.放在同一文件夹下用phpstorm打开. 创建index.html-------------每一行都 ...

  6. OpenLayers的定制

    最近因为工作的需要,把主流的的一些GIS的javascript库看了一遍,主要是ArcGIS Server API for Javascript,Openlayers和Leaflet. 先说说ArcG ...

  7. OpenLayers工作原理

    1.数据组织 OpenLayers通过同层(Layer)进行组织渲染,然后通过数据源设置具体的地图数据来源.因此,Layer与Source是密切相关的对应关系,缺一不可.Layer可看做渲染地图的层容 ...

  8. openlayers 3 简书

    1. 简书http://www.jianshu.com/p/6785e755fa0d 2. 文档 http://anzhihun.coding.me/ol3-primer/ch03/03-02.htm ...

  9. OpenLayers添加点【php请求MySQL数据库返回GeoJSON数据】

    php请求MySQL数据库返回GeoJSON数据的实现方法请参见: http://www.cnblogs.com/marost/p/6234514.html OpenLayers[v3.19.1-di ...

随机推荐

  1. Computation expressions and wrapper types

    原文地址:http://fsharpforfunandprofit.com/posts/computation-expressions-wrapper-types/ 在上一篇中,我们介绍了“maybe ...

  2. 非常简洁的js图片轮播

    <div id="tupian"></div><script>var jpg =new Array();jpg[0]="url(c.j ...

  3. AJAX 创建表格

    <html><head> <meta http-equiv="Content-Type" content="text/html; chars ...

  4. D - Digging（01背包，贪心）

    D - Digging Time Limit:2000MS     Memory Limit:65536KB     64bit IO Format:%lld & %llu Submit St ...

  5. C#第八天

    ArrayList ArrayList list=new ArrayList(): list.Add()           //添加单个元素 list.AddRange()   //添加集合元素 l ...

  6. 把ResultSet对象转变成List对象

    private static List<Map<String, Object>> convertRS2List(ResultSet rs) throws SQLExceptio ...

  7. 《JavaScript高级程序设计》读书笔记 ---语句

    do-while语句do-while 语句是一种后测试循环语句,即只有在循环体中的代码执行之后,才会测试出口条件.换句话说,在对条件表达式求值之前,循环体内的代码至少会被执行一次.以下是do-whil ...

  8. svn hooks的使用demo

    我是理论家: svn server端提供了Hooks Script.所谓钩子实际上是一种时间触发机制,是指当系统执行到某个特殊的事件时,触发我们预定义的动作,可以让我们在某些特定状态发生的时候做我们想 ...

  9. 【第四篇】androidEventbus源代码阅读和分析

    1,分析androidEventbus的注册源代码: 我们在使用androidEventbus的第一步是注册eventbus,如下代码: EventBus.getDefault().register( ...

  10. drawableLayout的使用（转载讲的比较清晰的文章）

    创建drawbler的布局文件 初始化drawbler的列表 响应drawable列表点击事件 现在侧滑菜单使用很多,大都是通过SlidingMenu实现.现在也可以通过DrawerLayout 创建 ...