vue 本地中导入 maptalks

news2024/11/16 6:24:42

1、进入 github 中 maptalks 文件下载页面(https://github.com/maptalks/maptalks.js/releases)

这里可能会有朋友应为网络问题打不开 github ,可以查看作者另一篇关于解决该问题的文章👉GitHub 打不开问题解决

在这里插入图片描述
在这里插入图片描述

2、将下载好的文件放入项目的 public 文件下

在这里插入图片描述

3、在 index.html 中引入

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title> vue 本地中导入 maptalks </title>

        <link href="./public/maptalks.css" rel='stylesheet' type="text/css" />
        <script src="./public/maptalks.min.js" type="text/javascript"></script>
        <script src="./public/maptalks.js" type="text/javascript"></script>
        
    </head>
    <body>
        <div id="app"></div>
    </body>
</html>

4、导入后,直接在方法中 new maptalks 就能创建 maptalks 对象了

methods:{
	createMap(){
		let myMap = new maptalks.Map(...)
	}
}

5、添加标注后的效果

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1411434.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

为什么时序逻辑电路会落后一拍?

1、时序逻辑电路落后一拍&#xff1f; FPGA初学者可能经常听到一句话&#xff1a;“时序逻辑电路&#xff0c;或者说用 < 输出的电路会延迟&#xff08;落后&#xff09;一个时钟周期。”但在仿真过程中经常会发现不符合这一“定律”的现象–明明是在仿真时序逻辑&#xff…

2024年AI全景预测

欢迎来到 2024 年人工智能和技术的可能性之旅。 在这里&#xff0c;每一个预测都是一个潜在的窗口&#xff0c;通向充满创新、变革、更重要的是类似于 1950 年代工业革命的未来。 20 世纪 50 年代见证了数字计算的兴起&#xff0c;重塑了行业和社会规范。 如今&#xff0c;人工…

VR全景如何引爆民宿热潮?

“尔滨”旅游热还未消散&#xff0c;好看的风景、好吃的美食统统安排起来&#xff0c;但是不知道大家出游对住的环境有没有讲究呢&#xff1f;很多人喜欢民宿的原因&#xff0c;就是因为游玩一整天&#xff0c;希望有一个温馨舒适的住处&#xff0c;来缓解身体、精神上的疲劳。…

中仕教育:事业单位考试考什么?

事业单位考试分为两个阶段&#xff0c;分别是笔试和面试&#xff0c;考试科目包括公共科目和专业科目两部分。 公共科目内容是公共基础知识、职业能力测试或申论。一种形式为&#xff1a;公共基础知识职业能力测试或职业能力测试申论。另一种形式为&#xff1a;公共基础申论。…

02-Redis持久化、主从与哨兵架构详解

文章目录 Redis持久化RDB快照&#xff08;snapshot&#xff09;bgsave的写时复制(COW)机制AOF&#xff08;append-only file&#xff09;AOF重写RDB 和 AOF &#xff0c;我应该用哪一个&#xff1f; Redis 4.0 混合持久化Redis数据备份策略&#xff1a; Redis主从架构redis主从…

Kerberos认证过程

Kerberos协议角色组成&#xff1a; Kerberos协议中存在三个角色&#xff0c;分别是&#xff1a; 客户端 (client)&#xff1a;发送请求的一方服务端&#xff08;server&#xff09;接受请求的一方钥匙分发中心(Key distribution KDC) 密钥分发中心又分为两个部分&#xff0…

Leetcode—30. 串联所有单词的子串【困难】

2023每日刷题&#xff08;九十五&#xff09; Leetcode—30. 串联所有单词的子串 实现代码 class Solution { public:vector<int> findSubstring(string s, vector<string>& words) {unordered_map<string, int> raw;// words单词个数int n words.siz…

勒索袭击新方式,提防注册机中注入的勒索病毒!

1 事件概述 近期&#xff0c;用户反馈称自己在使用某款“注册机”软件时候&#xff0c;系统中文件被不行加密。通过对受害用户提供的线索和样本进 行综合分析研判&#xff0c;发现了一款借助破解类工具进行传播的新型勒索软件&#xff0c;其会通过向桌面释放勒索信与收款码图片…

STC89C51单片机

本文为博主 日月同辉&#xff0c;与我共生&#xff0c;csdn原创首发。希望看完后能对你有所帮助&#xff0c;不足之处请指正&#xff01;一起交流学习&#xff0c;共同进步&#xff01; > 发布人&#xff1a;日月同辉,与我共生_单片机-CSDN博客 > 欢迎你为独创博主日月同…

Vue2 props组件通信

一、父组件向子组件传值 1、流程图 2、父组件代码 <template><div class"app"><UserInfo:usernameusername:ageage:isSingleisSingle:carcar:hobbyhobby></UserInfo></div> </template><script> import UserInfo from .…

JavaScript 学习笔记(JS进阶 Day2)

「写在前面」 本文为 b 站黑马程序员 pink 老师 JavaScript 教程的学习笔记。本着自己学习、分享他人的态度&#xff0c;分享学习笔记&#xff0c;希望能对大家有所帮助。推荐先按顺序阅读往期内容&#xff1a; 1. JavaScript 学习笔记&#xff08;Day1&#xff09; 2. JavaSc…

【c语言】扫雷

前言&#xff1a; 扫雷是一款经典的单人益智游戏&#xff0c;它的目标是在一个方格矩阵中找出所有的地雷&#xff0c;而不触碰到任何一颗地雷。在计算机编程领域&#xff0c;扫雷也是一个非常受欢迎的项目&#xff0c;因为它涉及到许多重要的编程概念&#xff0c;如数组、循环…

HNU-编译原理-甘晴void学习感悟

前言 熬过煎熬的考试周、复习以及更加煎熬的等成绩&#xff0c;查到成绩的那一刻&#xff0c;心里还是挺开心的。 虽然我没有完全学懂这门课程&#xff0c;但我还是兢兢业业地通过了课程的考试&#xff0c;拿到了这门课程的认可。 记录一下自己对编译原理的学习感悟&#xf…

虹科分享丨汽车技术的未来:Netropy如何测试和确保汽车以太网的性能

来源&#xff1a;艾特保IT 虹科分享丨汽车技术的未来&#xff1a;Netropy如何测试和确保汽车以太网的性能 原文链接&#xff1a;https://mp.weixin.qq.com/s/G8wihrzqpJJOx5i0o63fkA 欢迎关注虹科&#xff0c;为您提供最新资讯&#xff01; #汽车以太网 #车载网络 #Netropy …

【格密码基础】基于LWE问题的密码系统

目录 一. 介绍 二. LWE密码方案简单介绍 三. LWE经典归约 四. LWE性质 五. LWE的鲁棒性 一. 介绍 在2005年&#xff0c;Regev基于LWE问题提出了一个新的公钥密码方案。该方案可实现语义安全&#xff08;semantic security&#xff09;&#xff0c;其中误差率&#xff08;…

2023年我国民用无人机产业规模超过1200亿元,低空经济时代来临

2023年我国民用无人机产业规模超过1200亿元&#xff0c;低空经济时代来临 根据最新数据显示&#xff0c;2023年中国的民用无人机产业规模已经超过了1200亿元&#xff0c;稳居全球榜首。预计到2025年&#xff0c;这个数字将突破2000亿元&#xff0c;届时低空经济对国民经济的综…

SpringBoot 自定义Filter 提前返回 CORS 错误 处理前后端分离跨域配置无效问题解析

前言 浏览器有跨域限制&#xff0c;非同源策略 (协议、主机名或端口不同) 被视为跨域请求&#xff0c;解决跨域有跨域资源共享(CORS)、反向代理和 JSONP的方式。本篇通过 SpringBoot 的资源共享配置 (CORS) 来解决前后端分离项目的跨域&#xff0c;以及从原理上去解决跨域配置…

docker指令存档

目录 Docker 1、概念 2、架构图 3、安装 4、Docker怎么工作的&#xff1f; 5、Docker常用命令 帮助命令 镜像命令 1、查看镜像 2、帮助命令 3、搜索镜像 4、拉取镜像 5、删除镜像 容器命令 1、启动 2、查看运行的容器 3、删除容器 4、启动&停止 其他命令…

开始学习Vue2(axios和Vuex)

一、Axios 1、Axios 简介 Axios 是一个基于 promise 网络请求库 &#xff0c;作用于node.j s 和浏 览器中。它是 isomorphic 的(即同一套代码可以运行在浏览器 和 node.js 中)。在服务端它使用原生 node.js http 模块, 而在 客户端 (浏览端) 则使用 XMLHttpRequests。 …

滴滴开源小程序框架 Mpx 新特性:局部运行时能力增强

Mpx 是滴滴开源的一款增强型跨端小程序框架&#xff0c;自 2018 年立项开源以来如今已经进入第六个年头&#xff0c;在这六年间&#xff0c;Mpx 根植于业务&#xff0c;与业务共同成长&#xff0c;针对小程序业务开发中遇到的各类痛点问题提出了解决方案&#xff0c;并在滴滴内…