openlayers [二] 初始化map 以及map的一些参数

原创

已于 2024-01-16 15:59:16 修改 · 1.8k 阅读

9 ·

CC 4.0 BY-SA版权

[email protected]

文章标签：

#javascript #arcgis #webgis

于 2024-01-16 15:58:54 首次发布

文章目录

- map 参数
- 效果图
- 代码
- 分析

map 参数

controls 地图的控件
pixelRatio 设备上物理像素与设备无关像素（dip）之间的比率。
interactions 地图的互动
keyboardEventTarget 监听键盘事件的元素。这决定了KeyboardPan和 KeyboardZoom互动的触发时间。例如，如果将此选项设置为 document键盘，则交互将始终触发。如果未指定此选项，则库在其上侦听键盘事件的元素是地图目标（即用户为地图提供的div）。如果不是 document，则需要集中目标元素以发射关键事件，这要求目标元素具有tabindex属性。
layers 图层
maxTilesLoading 同时加载的最大瓦片数。
overlays 叠加层最初添加到地图中。默认情况下，不添加任何覆盖。
target 地图的容器
view  地图的视图

效果图

在这里插入图片描述

代码

<template>
    <div class="container">
        <h3>加载OpenStreetMap地图</h3>
        <p>超爷openlayer</p>
        <div id="vue-openlayers"></div>
        <a href="https://xiehao.blog.csdn.net/article/details/105272407">
            详情地址
        </a>
    </div>
</template>

<script setup>
import {
   
    ref, onMounted } from "vue";
import "ol/ol.css";
import {