您现在的位置: 首页 > 微信营销 > 微信攻略文章 > 小程序地图api:如何实现公司地址显示在小程序地图上?

小程序地图api:如何实现公司地址显示在小程序地图上?

作者:pc668   来源:  热度:574  时间:2021-08-09
1.微信公众平台登录小程序账号2.点击左侧的“附近小程序”→“开通”注意看开通的条件:主体必须是企业小程序地图api、媒体、政府和其他组织的小程序.3.点击“添加”选择及填写相应信息。注意三证合一的统一社会信用代码最后一位字母需要大写,否则会提示错误。之后点击“提交”4.现在就完成申请了,等待审核即可,(站内信即右上角的通知中心)5.如果审核通过,并设置对用户开放展示,在设置地址的一定范围内打开微信,在附近小程序列表中就会出现你的小程序

1.微信公众平台登录小程序账号2.点击左侧的“附近小程序”→“开通”注意看开通的条件:主体必须是企业小程序地图api、媒体、政府和其他组织的小程序.3.点击“添加”选择及填写相应信息。注意三证合一的统一社会信用代码最后一位字母需要大写,否则会提示错误。之后点击“提交”4.现在就完成申请了,等待审核即可,(站内信即右上角的通知中心)5.如果审核通过,并设置对用户开放展示,在设置地址的一定范围内打开微信,在附近小程序列表中就会出现你的小程序了

如何调用码怪网地图API?

这个很简单,只要注册一下码怪网地图开发者,创建应用生成AK,在script标签中传入AK值,就可以直接调用码怪网地图API了,下面我简单介绍一下实现过程,主要内容如下:

小程序地图api:如何实现公司地址显示在小程序地图上?

1.注册码怪网地图开发者,这个直接用自己的码怪网账号登陆就行,进入码怪网地图官网,依次点击“控制台”->“创建应用”,如下,在弹出的窗口选择浏览器端,输入应用名称:

小程序地图api:如何实现公司地址显示在小程序地图上?

小程序地图api:如何实现公司地址显示在小程序地图上?

创建成功后,就会自动返回到应用列表,刚才创建的应用就会显示出来,这里我们需要记住应用的AK值,后面的代码中需要用到这个AK值:

小程序地图api:如何实现公司地址显示在小程序地图上?

小程序地图api:如何实现公司地址显示在小程序地图上?

2.应用创建成功后,我们就可以在网页中引入码怪网地图了,代码很简单,创建一个div容器,然后通过JS API引入码怪网地图就行,如下:

小程序地图api:如何实现公司地址显示在小程序地图上?

用浏览器打开这个页面,效果如下,已经成功引入码怪网地图:

3.这里我们也可以引入地铁图,基本过程和上面的普通地图差不多,先创建一个div容器,然后直接引入地铁图,主要代码如下,很简单:

用浏览器打开这个网页,效果如下,已经成功引入地铁图:

至此,我们就完成了在前端网页中调用码怪网地图API。总的来说,整个过程很简单,注册开发者,创建引用,然后直接在代码中引入调用就行,这个我以前也回答过,可以参考一下我前面的回答,只要你熟悉一下相关示例和代码,多练习几遍,很快就能掌握的,官网也给出了非常详细的说明文档,很适合开发者学习,可以参考一下,网上也有相关教程和资料,感兴趣的话,可以搜一下,希望以上分享的内容能对你有所帮助吧,也欢迎大家评论、留言。

如何在地图上插入图片并标注经纬度?

地图刚加载完的时候显示一个默认的范围,本例子显示的是河南省,右键点击,删除地图上所有的标注并添加标注,并获取新标注的经纬度,也可以通过搜索地址,查询大概范围。(详情看代码中的注释)

小程序地图api:如何实现公司地址显示在小程序地图上?

小程序地图api:如何实现公司地址显示在小程序地图上?

<h2>Index</h2> <!--码怪网地图显示的地方--> <div style="width: 697px; height: 462px;" id="container"> </div> <!--码怪网地图显示的地方--> <script src="/Scripts/jquery-1.7.1.js"></script> <script type="text/javascript" src="/api?v=1.2"></script> <script type="text/javascript"> var map = new BMap.Map("container");//在指定的容器内创建地图实例 map.setDefaultCursor("crosshair");//设置地图默认的鼠标指针样式 map.enableScrollWheelZoom();//启用滚轮放大缩小,默认禁用。 //根据经纬度选择默认范围 //map.centerAndZoom(new BMap.Point(116.124878, 24.309178), 13); map.centerAndZoom("河南省", 8);//默认地图的显示范围 map.addControl(new BMap.NavigationControl()); map.addEventListener("rightclick", function (e) {//地图右键单击事件,左键为click map.clearOverlays();//添加标注前清空以前的所有标注 document.getElementById("txtjingweidu").value = e.point.lng ", " e.point.lat; var marker = new BMap.Marker(new BMap.Point(e.point.lng, e.point.lat)); // 创建标注 map.addOverlay(marker); }); function sear(result) {//根据地质搜索范围 var local = new BMap.LocalSearch(map, { renderOptions: { map: map } }); local.search(result); }</script> <input id="txtAddress" type="text" /> <input id="butSearch" type="button" οnclick="sear(document.getElementById('txtAddress').value)" value="搜索"/>经纬度:<input id="txtjingweidu" type="text" />

小程序地图api:如何实现公司地址显示在小程序地图上?

登录

使用微信帐号或QQ直接登录,无需注册