返回顶部
首页 > 资讯 > 精选 >百度地图使用到的javascript函数是什么
  • 678
分享到

百度地图使用到的javascript函数是什么

2023-06-17 06:06:10 678人浏览 八月长安
摘要

这篇文章主要讲解了“百度地图使用到的javascript函数是什么”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“百度地图使用到的javascript函数是什么”吧! javascr

这篇文章主要讲解了“百度地图使用到的javascript函数是什么”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“百度地图使用到的javascript函数是什么”吧!

 javascript 开发之百度地图使用到的js函数整理

   //创建和初始化地图函数:         function initMap(){      createMap();//创建地图      setMapEvent();//设置地图事件      addMapControl();//向地图添加控件      addMarker();//向地图中添加marker     }          //创建地图函数:     function createMap(){      var map = new BMap.Map("container");//在百度地图容器中创建一个地图      var point = new BMap.Point(116.395645,39.929986);//定义一个中心点坐标      map.centerAndZoom(point,12);//设定地图的中心点和坐标并将地图显示在地图容器中      window.map = map;//将map变量存储在全局     }          //地图事件设置函数:     function setMapEvent(){      map.enableDragging();//启用地图拖拽事件,默认启用(可不写)      map.enableScrollWheelZoom();//启用地图滚轮放大缩小      map.enableDoubleClickZoom();//启用鼠标双击放大,默认启用(可不写)      map.enableKeyboard();//启用键盘上下左右键移动地图     }       //地图控件添加函数:     function addMapControl(){       //向地图中添加缩放控件      var ctrl_nav = new BMap.NavigationControl({anchor:BMAP_ANCHOR_TOP_LEFT,type:BMAP_NAVIGATION_CONTROL_LARGE});      map.addControl(ctrl_nav);       //向地图中添加缩略图控件      var ctrl_ove = new BMap.OverviewMapControl({anchor:BMAP_ANCHOR_BOTTOM_RIGHT,isOpen:1});      map.addControl(ctrl_ove);       //向地图中添加比例尺控件      var ctrl_sca = new BMap.ScaleControl({anchor:BMAP_ANCHOR_BOTTOM_LEFT});      map.addControl(ctrl_sca);     }          //标注点数组     var markerArr = [{title:"我的标记",content:"我的备注",point:"116.354539|39.970253",isOpen:0,icon:{w:21,h:21,l:0,t:0,x:6,lb:5}}       ];     //创建marker     function addMarker(){      for(var i=0;i<markerArr.length;i++){       var JSON = markerArr[i];       var p0 = json.point.split("|")[0];       var p1 = json.point.split("|")[1];       var point = new BMap.Point(p0,p1);       var iconImg = createIcon(json.icon);       var marker = new BMap.Marker(point,{icon:iconImg});       var iw = createInfoWindow(i);       var label = new BMap.Label(json.title,{"offset":new BMap.Size(json.icon.lb-json.icon.x+10,-20)});       marker.setLabel(label);              map.addOverlay(marker);       label.setStyle({          borderColor:"#808080",          color:"#333",          cursor:"pointer"       });       (function(){        var index = i;        var _iw = createInfoWindow(i);        var _marker = marker;        _marker.addEventListener("click",function(){         this.openInfoWindow(_iw);        });        _iw.addEventListener("open",function(){         _marker.getLabel().hide();        })        _iw.addEventListener("close",function(){         _marker.getLabel().show();        })        label.addEventListener("click",function(){         _marker.openInfoWindow(_iw);        })        if(!!json.isOpen){         label.hide();         _marker.openInfoWindow(_iw);        }       })()      }     }     //创建InfoWindow     function createInfoWindow(i){      var json = markerArr[i];      var iw = new BMap.InfoWindow("<b class='iw_poi_title' title='" + json.title + "'>" + json.title + "</b><div class='iw_poi_content'>"+json.content+"</div>");      return iw;     }     //创建一个Icon     function createIcon(json){      var icon = new BMap.Icon("Http://openapi.baidu.com/map/images/us_mk_icon.png", new BMap.Size(json.w,json.h),{imageOffset: new BMap.Size(-json.l,-json.t),infoWindowOffset:new BMap.Size(json.lb+5,1),offset:new BMap.Size(json.x,json.h)})      return icon;     }       initMap();//创建和初始化地图

感谢各位的阅读,以上就是“百度地图使用到的javascript函数是什么”的内容了,经过本文的学习后,相信大家对百度地图使用到的javascript函数是什么这一问题有了更深刻的体会,具体使用情况还需要大家实践验证。这里是编程网,小编将为大家推送更多相关知识点的文章,欢迎关注!

--结束END--

本文标题: 百度地图使用到的javascript函数是什么

本文链接: https://lsjlt.com/news/287471.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • 百度地图使用到的javascript函数是什么
    这篇文章主要讲解了“百度地图使用到的javascript函数是什么”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“百度地图使用到的javascript函数是什么”吧! javascr...
    99+
    2023-06-17
  • javascript开发之百度地图使用到的js函数有哪些
    小编给大家分享一下javascript开发之百度地图使用到的js函数有哪些,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧! javascript 开发之百度地图使用到的js函数整理...
    99+
    2024-04-02
  • 百度地图API的使用
    文章目录 一、百度地图--作者前言二、百度地图如何使用第一步:进入官网第二步:进入开发文档第三步:申请百度开发者密钥获取账户和密钥 第四步:插入百度地图4.1申请密钥=>已完成4.2...
    99+
    2023-08-31
    百度 php 前端
  • Android百度地图应用之MapFragment的使用
    一、简介  TextureMapFragment:用于显示地图片段。  二、示例3--Demo03MapFragment.cs  文件名:Demo...
    99+
    2022-06-06
    地图 地图应用 Android
  • 怎么在vue项目中使用百度地图API
    小编给大家分享一下怎么在vue项目中使用百度地图API,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!为什么要使用VueVue是一款友好的、多用途且高性能的Java...
    99+
    2023-06-14
  • uniapp上高德(百度)地图API的使用(APP安卓)
    前言 由于在app中没有document,window等对象,所以使用在pc端传统方法引入的方式,将会发现无法引用成功,会出现白屏现象。 目前有两种解决方式: 使用uniapp的web-view方式(百度地图) 使用renderjs...
    99+
    2023-10-12
    uni-app 百度api 高德api renderjs webview Powered by 金山文档
  • Vue2项目中对百度地图的封装使用详解
    目录需求知识点实现打点控件封装代码总览代码总结 百度地图的使用: vue项目,有个 vue-baidu-map 可以用,但是好久不更新了。 React项目,百度官...
    99+
    2024-04-02
  • Vue项目中使用百度地图api的详细步骤
    目录1.百度开发者认证2.创建应用3.引用百度地图API文件总结1.百度开发者认证 进入百度地图开放平台 官网,(认证需要身份证号码,人脸识别,手机百度APP,邮箱地址) ...
    99+
    2022-11-13
    vue使用百度地图api 百度地图api接口 vue 地图
  • JavaScript中函数的作用是什么
    本篇内容介绍了“JavaScript中函数的作用是什么”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成! ...
    99+
    2024-04-02
  • JavaScript eval()函数的作用是什么
    JavaScript的eval()函数的作用是将一个字符串作为脚本代码进行解析和执行。它可以动态地执行字符串中的JavaScript...
    99+
    2023-10-11
    JavaScript
  • JavaScript parseInt()函数的用法是什么
    JavaScript中的parseInt()函数用于将字符串转换为整数。它接受两个参数:要转换的字符串和一个可选的基数(表示要解析的...
    99+
    2023-10-11
    JavaScript
  • JavaScript escape()函数的用法是什么
    JavaScript的escape()函数用于对字符串进行编码,使其可以在URL中安全地传输。语法:escape(string)参数...
    99+
    2023-10-11
    JavaScript
  • JavaScript函数与作用域的使用方法是什么
    本篇内容介绍了“JavaScript函数与作用域的使用方法是什么”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所...
    99+
    2024-04-02
  • vue.js中vue-cli脚手架使用百度地图API的示例分析
    小编给大家分享一下vue.js中vue-cli脚手架使用百度地图API的示例分析,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!第...
    99+
    2024-04-02
  • JavaScript中arrow函数的作用是什么
    本篇文章为大家展示了JavaScript中arrow函数的作用是什么,内容简明扼要并且容易理解,绝对能使你眼前一亮,通过这篇文章的详细介绍希望你能有所收获。我们先来按常规语法定义函数:function&nb...
    99+
    2024-04-02
  • javascript常用的系统函数是什么
    这篇文章将为大家详细讲解有关javascript常用的系统函数是什么,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。js常用的系统函数有:1、parseInt,从一个字符串中提取整数;2、parseFloa...
    99+
    2023-06-15
  • javascript中eval函数的作用是什么
    本篇文章给大家分享的是有关javascript中eval函数的作用是什么,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。(1)介绍javascript中的eval函数的用法(2)...
    99+
    2023-06-03
  • JavaScript的函数是什么意思
    这篇文章主要介绍了JavaScript的函数是什么意思,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。 在Java...
    99+
    2024-04-02
  • javascript中的函数是指什么
    这篇文章主要讲解了“javascript中的函数是指什么”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“javascript中的函数是指什么”吧! ...
    99+
    2024-04-02
  • JavaScript的回调函数是什么
    这篇文章主要介绍“JavaScript的回调函数是什么”,在日常操作中,相信很多人在JavaScript的回调函数是什么问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”Java...
    99+
    2024-04-02
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作