OpenLayers7官方文档翻译,OpenLayers7中文文档,OpenLayers快速入门

在这里插入图片描述

快速入门

这个入门文档向您展示如何放一张地图在web网页上。
开发设置使用 NodeJS(至少需要Nodejs 14 或更高版本),并要求安装 git

设置新项目

开始使用OpenLayers构建项目的最简单方法是运行:npm create ol-app

npm create ol-app my-app
cd my-app
npm start
  1. 第一个命令将创建一个名为 my-app 的目录(如果您愿意,可以使用不同的名称),安装 OpenLayers 和开发服务器,并使用index.htmlmain.jsstyle.css 文件设置一个基本应用程序。

  2. 第二个命令 (cd my-app) 将工作目录更改为新的 my-app 项目,以便您可以开始使用它。

  3. 第三个命令 (npm start) 启动开发服务器,以便您可以在处理应用程序时在浏览器中查看应用程序。运行 npm start 后,你将看到告诉你要打开的 URL 的输出。打开 http://localhost:5173/(或显示的任何 URL)以查看新应用程序。

探索组件

OpenLayers 应用程序由三个基本部分组成:

  • 带有包含映射的元素的 HTML 标记(index.html
  • 初始化地图的 JavaScript(main.js)
  • 确定地图大小和任何其他自定义项的 CSS 样式(style.css)

markup(标记)

在文本编辑器中打开 index.html 文件。它应该看起来像这样:

DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Quick Starttitle>
  head>
  <body>
    <div id="map">div>
    <script type="module" src="./main.js">script>
  body>
html>

标记中的两个重要部分是

包含映射的元素和

你可能感兴趣的:(arcgis,前端,OpenLayers,OpenLayers中文文档,OpenLayers官方文档,OpenLayers官方案例)