前端调用高德地图的接口

2023-11-16

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="jquery-3.4.1.min.js"></script>
    <script type="text/javascript"
        src="https://webapi.amap.com/maps?v=1.4.15&key=7f3b04e41812fc230bf64bc4bf0b40e7"></script>
    <!--  异步版本 ui组件, 用于添加城市信息 -->
    <script src="https://webapi.amap.com/ui/1.0/main.js?v=1.0.11"></script>
    <!-- <script src="//webapi.amap.com/ui/1.0/main-async.js"></script> -->
    <!-- 移动端开发时, 添加以下内容 -->
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
</head>
<style>
    #container {
        width: 600px;
        height: 480px;
        display: inline-block;
    }
    #container1 {
        width: 600px;
        height: 480px;
    }
    #right{
        float: left;
        margin-top: 40px;
    }
</style>

<body>
    <!-- 先在开发者页面创建应用,申请key, 然后使用 -->
    <!-- 高德教程地址  https://lbs.amap.com/api/javascript-api/guide/abc/plugins#plugins -->

    <!-- 选择城市教程
        https://lbs.amap.com/api/webservice/guide/api/district -->
    <div id="container"> </div>
    <div id='right'>
        <div>
            <div class='title'>选择模式</div>
            <input type='radio' name='mode' value='dragMap' checked>拖拽地图模式</input>
            <!-- </br> -->
            <input type='radio' name='mode' value='dragMarker' checked>拖拽图标模式</input>
        </div>
        <div>
            <button id='start'>开始选点</button>
            <button id='stop'>关闭选点</button>
        </div>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

前端调用高德地图的接口 的相关文章

  • 基于梯度下降算法求解线性回归

    点击上方 小白学视觉 选择加 星标 或 置顶 重磅干货 第一时间送达 01 线性回归 Linear Regression 梯度下降算法在机器学习方法分类中属于监督学习 利用它可以求解线性回归问题 计算一组二维数据之间的线性关系 假设有一组数
  • Solidworks2022-2-软件安装步骤

    Solidworks2022软件安装步骤 1 先确定你的系统是否已经安装了 net 3 5 和 net 4 0 net 3 5 和 net 4 0查看方法 如果 没有或缺少 根据第二张图进行下载或增加一下 2 断开网络连接 关闭保护设置 3
  • Linux_centos7_vi/vim程序编辑器_(6)_(bird_bro)

    参考资料 https studylib net doc 11479665 vi vim graphical cheat sheet q j
  • noj.26 二叉排序树的合并

    题目描述 分析 1 先序 创建二叉排序树 2 在二叉排序树中插入一个值 3 n 大于根节点在右子树中插入 4 n 小于根节点在左子树中插入 5 合并排序二叉树 6 中序输出合并后的排序二叉树 完整代码 include

随机推荐

  • 谈谈react操作onMouseEnter、onMouseLeave结合css里的hover

    react对于每个html元素都添加了很多事件处理函数 这些事件网上一搜就都出来了 这里简单说下在react中利用js进行操作类似于css里的hover所使用的事件 比如这样一个需求 有以下3个div div class a abc a d
  • 在 cocos2d 里面如何使用 Texture Packer 和像素格式来优化 spritesheet

    原文链接 http www cnblogs com andyque archive 2011 03 18 1988097 html 免责申明 必读 本博客提供的所有教程的翻译原稿均来自于互联网 仅供学习交流之用 切勿进行商业传播 同时 转载
  • java开发思路_Java Web开发教程——基本思路

    思路 将需求拆解为基本技术的简单组合 再分别实现 基本技能必须是足够简单且容易理解的 对基本技能的组合 必须是严格相等于需求域的 不能有缺漏 一 基本技能 基础知识 B S Browser Server 就是以浏览器作为用户界面与用户进行交
  • LeetCode 解题笔记(三)字符串

    文章目录 一 基础篇 344 反转字符串 2022 03 06 7 整数反转 2022 03 07 387 字符串中的第一个唯一字符 2022 03 08 242 有效的字母异位词 2022 03 09 总目录 LeetCode 解题笔记
  • Docker部署node.js应用

    前言 什么是docker 通俗的理解 docker是创建和管理容器的一种技术 那什么是容器呢 容器的功能与虚拟机很近似 都是在一个物理主机上运行多个操作系统的技术 最大的不同之处在于 虚拟机技术是虚拟出一套硬件后 在其上运行一个完整操作系统
  • 某银行降低贷款拖欠率的逻辑回归建模

    代码 coding utf 8 Created on Sat Jul 15 17 48 35 2017 author Administrator 逻辑回归建模 import pandas as pd from sklearn linear
  • CA,证书,公钥,私钥,加密算法常识总结

    数据传输安全要满足的要求 发送方能够确定消息只有预期的接收方可以解密 不保证第三方无法获得 但保证第三方无法解密 接收方可以确定消息是由谁发送的 接收方可以确定消息的发送方 接收方可以确定消息在途中没有被篡改过 必须确认消息的完整性 加密和
  • M-estimator M估计法 用于几何模型建立

    M estimators是一类广泛估计函数 定义为所给数据上的最小和函数 最小平方估计和极大似然估计都是M估计法 M估计法由鲁棒的数据作为运行保证 一般地 一个M estimation定义为一个估计函数为0的情况 这个估计函数经常是一些统计
  • 剑指offer试题编程练习11(java) 位运算符的运用

    11 输入一个整数 输出该数二进制表示中1的个数 其中负数用补码表示 首先回顾原码 反码 补码的知识 来自https www jianshu com p 36ec7a047f29 在计算机底层均是以二进制表示的 数字也不例外 下面以8位bi
  • 14-数组与指针

    寻址运算符 指针运算符 寻址运算符与 指针运算符 具有相同的优先级 自右向左结合 int a Int p a a gt a p gt p int p a 指针的赋值 声明的时候 赋值int p a 先声明再赋值 int a int p p
  • Mac配置item2高亮颜色

    item2颜色生效配置 1 bash设置 在导入并应用完颜色方案之后 通过命令vim bash profile 或open bash profile编辑文件 添加以下内容 之后source bash profile来应用文件修改 CLICO
  • 数据技术之数据挖掘

    第7章 数据挖掘 1 什么是数据挖掘 数据挖掘 Data Mining 就是从大量的数据中 提取隐藏在其中的 事先不知道的 但潜在有用的信息的过程 数据挖掘的目标是建立一个决策模型 根据过去的行动数据来预测未来的行为 2 阿里数据挖掘平台
  • TypeScript笔记

    数据基础类型定义 let username string 管理员 username 系统管理员 模板字符串 使用反引号 let describe string 今天天气 weather sencence方式 let info string
  • Spring Cloud微服务项目实战笔记(二)是什么推动了单体应用到微服务架构的演进?

    首先对比的是单体应用 一个有问题 大家都完蛋 重新回滚到上一版本 开发测试沟通成本也大 微服务架构的优势 每个微服务是一个小的完整单位 独立的代码库数据库 自己去快速迭代功能 快速迭代 快速回滚 资源利用大大提高 大幅降低协作成本 高可用
  • 链表 -- 算法 -- leetcode

    翻转链表前n个节点 虚拟头结点的使用情况 链表的首节点可能发生改变 虚拟头结点 ret gt next head 力扣 力扣 力扣 力扣 力扣 力扣 力扣 力扣 力扣
  • 期望/方差/协方差/相关系数

    期望 在概率论和统计学中 数学期望 mean 或均值 亦简称期望 是试验中每次可能结果的概率乘以其结果的总和 是最基本的数学特征之一 它反映随机变量平均取值的大小 离散型随机变量的一切可能的取值Xi与对应的概率p xi 乘积之和称为该离散型
  • 会员ID查询测试用例设计

    检查点 默认值检查 异常输入 查询结果检查 正常输入 查询结果检查 测试用例设计 1 前提 存在会员ID abc abcd 1abc 会员id输入为字母abc 其它默认 点击 搜索 显示完全匹配该条件的数据 即只显示会员ID abc的记录
  • linux 线程

    1 线程概述 与进程的区别及线程的优势 什么是线程 在一个程序里的一个执行路线就叫做线程 thread 更准确的定义是 线程是 一个进程内部的控制序列 一切进程至少都有一个执行线程 线程是进程内部的一条执行序列或执行路径 即一个可调度的实体
  • 读书小记--<态度>

    前言 前段时间再读了吴军老师的 态度 分享的是和女儿的日常书信 觉得收获很多 同事推荐他的 浪潮之巅 数学之美 系列书籍 下面是个人的觉得认同或值得深入学习的一些点 特此记录一下 态度决定命运 文中写道撒切尔夫人的一句话 注意你的想法 因为
  • 前端调用高德地图的接口