当前位置: 首页 > news >正文

一、openlayer开发介绍

首先需要引入openlayer api开发包。两种方式:

1、import方式,也就是npm安装,npm install ol

2、外部js引入。

下载地址:https://github.com/openlayers/openlayers

历史版本地址:Releases · openlayers/openlayers · GitHub

里边有源码,有打包的文件。

下载后直接放入本地项目,在html文件引入即可

  <link href="/static/openlayer/ol/ol.css" rel="stylesheet" /><script type="text/javascript" src="/static/openlayer/ol/js/ol.js"></script> 

3、引用cdn在线的,不推荐,毕竟在线的受网络影像,但是做做demo样例可以用

  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/ol@v7.3.0/ol.css" type="text/css"><script src="https://cdn.jsdelivr.net/npm/ol@v7.3.0/dist/ol.js"></script>

在项目中使用接口:

可以直接这样用:ol.Map,ol.layer

个人喜欢直接在上面直接这样定义:const Map = ol.Map; const View = ol.View;就不用加那些类名属性了。当时npm导入的话,直接就是:import { Point } from "ol/geom"; 

都要注意类名目录。具体可以看官网api

OpenLayers v7.5.1 API - IndexOpenLayers v7.5.1 API - IndexOpenLayers v7.5.1 API - Index

还有大牛翻译的中文版:

OpenLayers v7.3.0 API - Index

地图示例

中文:

OpenLayers Examples

英文:

OpenLayers Examples

http://www.lryc.cn/news/132175.html

相关文章:

  • 利用Jackson封装常用的JsonUtil工具类
  • 阿里云2核4G服务器配置汇总表_轻量和ECS
  • 攻防世界-ics-06
  • 人工智能轨道交通行业周刊-第56期(2023.8.14-8.20)
  • ruoyi-vue-pro yudao 项目报表设计器 积木报表模块启用及相关SQL脚本
  • 【第三阶段】kotlin中使用带let的安全调用
  • JavaScript 快速入门手册
  • FreeMarker系列--list的用法(长度,遍历,下标,嵌套,排序)
  • 【观察】戴尔科技:构建企业创新“韧性”,开辟数实融合新格局
  • 数据管理平台
  • 手搓大语言模型 使用jieba分词制作词表,词表大小几十万 加强依赖性
  • 【校招VIP】java语言类和对象之map、set集合
  • windows服务器下java程序健康检测及假死崩溃后自动重启应用、开机自动启动
  • 七夕特辑(一)浪漫表白方式 用神经网络生成一首情诗
  • springboot的 spring.redis.lettuce的max-active、max-idle、min-idle的搭配
  • 盒子模型样式
  • 动态规划入门之线性动态规划
  • 基于HTML+CSS+Echarts大屏数据可视化集合共99套
  • Leetcode 0814周总结
  • 华为网络篇 OSPF的Silent-Interface-33
  • longtext,bigint是什么数据类型
  • Hive无法启动的解决方案
  • 华为云零代码新手教学-体验通过Astro Zero快速搭建微信小程序
  • 【前端】快速掌握HTML+CSS核心知识点
  • 二叉树算法的框架套路总结
  • 【ARM 嵌入式 编译 Makefile 系列 2 - Makefile 如何打印信息】
  • re学习(34)攻防世界-csaw2013reversing2(修改汇编顺序)
  • centos 7.9 部署django项目
  • 12 正则表达式 | HTTP协议相关介绍
  • 【C语言】数组概述