openlayers 介绍
OpenLayers是 一个 高 性能 , 功能 丰富的库,用于在Web上创建交互式地图。它可以 显示 任何网页上任何来源加载的地图图块,矢量数据和 标记 。开发OpenLayers是为了进一步使用各种地理信息。
npm安装
npm install ol引入 文件
<link rel="stylesheet" href="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.3.0/css/ol.css" type="text/css"><script src="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.3.0/build/ol.js"></script>创建dom节点
<div id="map"?class="map"></div>定义样式
必须要定义好长和宽 才能正常使用<style>.map {height: 400px;width: 100%;}</style>初始化
var map = new ol.Map({controls: ol.control.defaults({attribution: false,rotate: false,zoom: false}),target: 'container',layers: [new ol.layer.Tile({// source: new ol .so urce.OSM() 这个使用open Streem ap 国内可用,但是无法将国内 显示 改为英文source: new ol .so urce.TileImage({url: 'http://www.google.cn/maps/vt/pb=!1m4!1m3!1i{z}!2i{x}!3i{y}!2m3!1e0!2sm!3i380072576!3m8!2szh-EN!3scn!5e1105!12m4!1e68!2m2!1sset!2sRoadmap!4e0!5m1!1e0'}) //谷歌地图 支持 中国地区 显示 英文和 中文 ,其他国家 显示 英文和当地国家语言})],view: new ol.View({center: ol.proj.fromLonLat(centerPoint),zoom: 10})}); 链接 : http://www.fly63.com/nav/2703网站地址 : https://openlayers.org
GitHub: https://github.com/openlayers/openlayers
网站描述: 一个 高 性能 , 功能 丰富的库
openlayers官方网站
官方网站: https://openlayers.org
如果觉得 网站内容还不错,欢迎将 网站 推荐给程序员好友。
声明:本文来自网络,不代表【好得很程序员自学网】立场,转载请注明出处:http://haodehen.cn/did176655