OpenLayers3加载Geojson文件

原创 2016年05月31日 14:40:05

1.引入OL3的js文件和css文件

 <link rel="stylesheet" href="http://openlayers.org/en/v3.16.0/css/ol.css" type="text/css">
    <script src="http://openlayers.org/en/v3.16.0/build/ol.js"></script>

2. 地图的div控件

<div id="map" class="map" tabindex="0"></div>

3.首先加载地图,然后加载geojson文件

var vectorone = new ol.layer.Tile({
            source: new ol.source.OSM()
            
        });
        //加载geojson数据
        var GeoJsonLayer = new ol.layer.Vector({
            title: 'add Layer',
            source: new ol.source.Vector({
                projection: 'EPSG:4326',
                url: './geojson/countries.geojson',
                format:new ol.format.GeoJSON()
            })
        });

4. //加载地图
        var map = new ol.Map({
            layers: [
              vectorone, GeoJsonLayer
            ],            
            target: 'map',
            controls: ol.control.defaults({
                attributionOptions: /** @type {olx.control.AttributionOptions} */ ({
                    collapsible: true
                })
            }),
            view: new ol.View({
                center: [52.5243700, 13.4105300],
                zoom: 2
            })
        });   

5.会出现不能读geojson的情况

  1.在iis中配置geojson的数据格式,Mime类型

2.或者在web.config文件下添加

 <system.webServer>
    <staticContent>
      <mimeMap fileExtension=".geojson" mimeType="application/geojson"/>
    </staticContent>
  </system.webServer>


openlayers3异步调用geojson, Ajax

Load Json

使用ajax跨域调用springboot框架的api传输文件

在新项目中使用的是springboot编写的api,涉及到ajax跨域请求和传输文件的问题...

Openlayers3加载DXF文件作为底图实现

主要记录本人对于DXF文件作为静态底图进行渲染的实现思路

OpenLayers 3 之 使用地理数据传输格式GeoJSON

用户请求地理数据或者其他数据,服务器要以一定的客户端能够识别的数据格式返回,数据格式是否高效,直接影响用户的体验!首先要求数据格式要是轻量级的,还要求客户端处理数据方便快捷,相较于XML,JSON满足...

OpenLayers3 之 使用地理数据传输格式GeoJSON

目录(?)[-] GeoJSON如何利用它构建应用PS 用户请求地理数据或者其他数据,服务器要以一定的客户端能够识别的数据 格式返回,数据格式是否高效,直接影响用户的体验!首先要求数据...

openlayers3上加载瓦片图片

  • 2017年08月29日 21:18
  • 64.28MB
  • 下载

Arcgis for js,Openlayers中加载GeoJSON

在前文中,讲述了在JAVA环境下如何将shp转换为GeoJSON,在本文,分别讲述在Arcgis for js,Openlayers2和Openlayers3中加载展示GeoJSON。...

OpenLayers 3 之 加载天地图

要使用 OpenLayers 3 加载天地图,首先要弄清楚天地图发布的原理,以及遵循的发布规范,上一篇中我们提到了使用 OpenLayers 3 加载百度地图,我们提到一般网络地图为了加快访问速度,都...

Openlayers3加载天地图

在前文中分别讲到了在Arcgis for js、Openlayers2中去加载天地图,同时也讲到了天地图的离线加载方式。在本文,讲述在Openlayers3中实现在线/离线的天地图的加载。...

openlayers3 加载各种底图,持续更新中。

/***************************************************************************** *                   ...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:OpenLayers3加载Geojson文件
举报原因:
原因补充:

(最多只允许输入30个字)