首页 > 其他分享 >soso地图api接口poi检索示例----并在信息框显示经纬度

soso地图api接口poi检索示例----并在信息框显示经纬度

时间:2023-08-08 22:33:22浏览次数:38  
标签:map 示例 soso ---- maps api poi var new



api官网:

http://api.map.soso.com/doc_v2/example.html?sample-search-simple#7map


示例代码如下(保存为html打开可见效果如下图):

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>按关键字查询</title>

<script charset="utf-8" src="http://api.map.soso.com/v1.0/main.js"></script>
<script>
var searchService,map,markers = [];
var init = function() {

    var center = new soso.maps.LatLng(39.916527,116.397128);
        map = new soso.maps.Map(document.getElementById('iCenter'),{
        center: center,
        zoomLevel: 13
    });
    searchService = new soso.maps.SearchService();
}
//清除地图上的marker
function clearOverlays(overlays){
    var overlay;
    while(overlay = overlays.pop()){
        overlay.setMap(null);
    }
}
function searchKeyword() {

    var keyword = "宽窄巷子";
    var region = "成都";
    clearOverlays(markers);
    var searchRequest = {
        'keyword': keyword,
        'region':region
    };
    var latlngBounds = new soso.maps.LatLngBounds();
    searchService.search(searchRequest, function(results, status) {
        if (status == soso.maps.SearchStatus.OK) {
            var pois = results.pois;
            for(var i = 0,l = pois.length;i < l; i++){
                var poi = pois[i];
                latlngBounds.extend(poi.latLng);  
                var marker = new soso.maps.Marker({
                    map:map,
                    position: poi.latLng,
                    title: poi.address+poi.latLng
                });

                var decor = new soso.maps.MarkerDecoration({
                    content: i+1,
                    margin: new soso.maps.Size(0, -4),
                    align: soso.maps.ALIGN.CENTER,
                    marker: marker
                });        
                markers.push(marker);
            }
            map.fitBounds(latlngBounds);
        } else {
        	$("#iCenter").append("检索没有结果,原因: " + status);
           
        }
    });
}

var showmap = function() 
{
init();
searchKeyword();
}

</script>

</head>
<body οnlοad="showmap();">  

        <div id="iCenter" style="height:300px;width=661px "></div>
    
        
</body>
</html>



soso地图api接口poi检索示例----并在信息框显示经纬度_地图api


标签:map,示例,soso,----,maps,api,poi,var,new
From: https://blog.51cto.com/u_16218512/7013106

相关文章

  • ASP.NET----jQuery插件flot绘画图表
    flot是一个基于jQuery的图表绘制插件效果挺好看的:参考资料:http://code.google.com/p/flot/ 谷歌官网http://www.flotcharts.org/flot/examples/categories/index.html 例子(可右键查看源文件看看代码)要用到的js文件以及中文api文档可以在这里下载(没分的M我,给你发)基本语......
  • 中国联通“双门户”全栈信创割接成功
    【筑牢安全防线】中国联通“双门户”全栈信创割接成功联通软件研究院 联通软件研究院  2023-06-3019:26 发表于北京收录于合集#赋能41个【筑牢安全防线】中国联通“双门户”全栈信创割接成功为落实国务院“十四五”数字经济发展规划“推广使用安全可靠的信息产品、服务和解决......
  • 高德地图api接口poi检索示例----并在信息框显示经纬度
    api官网链接:http://api.amap.com/Javascript/example#http://api.amap.com/Javascript/plugin_detail/id/0代码示例如下(保存为html打开可见效果如下图):<!DOCTYPEhtml><html><head><metahttp-equiv="Content-Type"content="text/html;charset=utf-8&qu......
  • mysql中的空间地理字段
    第19章:MySQL中的空间扩展目录19.1.前言19.2.OpenGIS几何模型19.2.1.Geometry类的层次19.2.2.类Geometry19.2.3.类Point19.2.4.类Curve19.2.5.类LineString19.2.6.类Surface19.2.7.类Polygon19.2.8.类GeometryCollection19.2.9.类MultiPoint19......
  • mysql配置my.cnf包含innodb配置详解
    1.#以下选项会被MySQL客户端应用读取。2.#注意只有MySQL附带的客户端应用程序保证可以读取这段内容。3.#如果你想你自己的MySQL应用程序获取这些值。4.#需要在MySQL客户端库初始化的时候指定这些选项。5.6.#7.[client]8.#password=[your_passwo......
  • 扶植版做出拓展版950通栏轮播效果无缝连接
       一、左侧栏和右侧栏各添加一个自定义区   二、将如下代码分别复制到两个自定义区的源码编辑区内:   1、右侧自定义区代码<DIVclass="slider-promoJ_SliderJ_TWidgettb-slide"style="RIGHT:200px;WIDTH:950px;HEIGHT:450px"data-widget-type="Slide"da......
  • mysql索引
    1,索引什么是索引?索引------搜索---引导------引导着我去搜索到某个记录的定义:没有索引的情况下,我们查询一条记录,需要从第一条记录一直往下查询,知道查找到我们需要的记录,如果记录数特别大的话,相当于大海捞针,速度特别慢索引:建一个索引-----指向的是数据的位置-----反映到新华字......
  • XAML格式化工具:XAML Styler
    XAML格式化的意义在开发WPF应用过程中,编写XAML时需要手动去缩进或者换行,随着时间的推移或者参与开发的人增多,XAML文件内容的格式会越来越乱。要么属性全都写在一行,内容太宽一屏无法完整展现;要么属性单独占一行,难以直观的看清结构;另外xaml元素的属性无序,重要属性查找困难,手动维护......
  • CF1239E 题解
    CF1239E给定\(2n\)个数,将其重排成\(2\timesn\)的矩阵,最小化:从\((1,1)\)走到\((2,n)\),只可向右下走的所有方案中,途径所有数的和的最大值。\(n\le25,|V|\le5\times10^4\)。考场上有个\(n\le10\)的包,分值高达\(40\)。注意到\(\binom{20}{10}\approx10^5\)可枚......
  • U盘配置系统
    1.安装英伟达驱动驱动下载地址:https://us.download.nvidia.cn/XFree86/Linux-x86_64/535.86.05/NVIDIA-Linux-x86_64-535.86.05.run以下是禁用Nouveau驱动的步骤:打开一个终端,输入以下命令来打开黑名单配置文件:sudovim/etc/modprobe.d/blacklist.conf在打开的文件末尾,添加......