zoukankan      html  css  js  c++  java
  • APICloud开发者进阶之路| H5Callmap 模块使用 demo

    # Demo(需要在APICloud环境下使用)
    地址:

    http://towercdn.suuzi.cn/H5Callmapdemo_win.html  

    # 功能描述
    该模块支持判断手机是否安装了指定地图软件;
    该模块适用于项目中根据目标经纬度唤起手机中安装的三方地图并标记位置,从而达到导航等地图功能的目地,目前支持 iosamap(高德地图导航)、baidumap(百度地图导航)、comgooglemap(google地图导航)。

    # 效果图

    # 依赖的模块


    # 方法
    判断当前系统为 iOS(异步)

    callMap.hasIos();                             
                                                       //必返     |           |  Boolean    |  true(是)/false(否)
    复制代码
    

      判断当前设备是否安装地图 APP(同步)

    callMap.fnAppInstalled('iosamap', function(ret){   //必填     |           |  String     |  iosamap(高德地图)、baidumap(百度地图)、comgooglemap(google地图)
       // ret.installed                                //必返     |           |  Boolean    |  true(已安装)、false(未安装)
    })
    复制代码
    

      打开某一个地图,并标记目标地点(异步)

    callMap.fnOpenMap({
        type: 'iosamap',                              //必填     |           |  String     |  地图类型。iosamap(高德地图)、baidumap(百度地图)、comgooglemap(google地图)
        end: {
            lat: 39.8411062307,                       //必填     |           |  String     |  目标经度
            lon: 116.7566751225                       //必填     |           |  String     |  目标纬度
        }
    })复制代码
    

      对象转 get 参数格式(异步)

    fnConvertParam({                                  //必填     |           |  Object     |  需要格式化的参数
        key1: '1',
        key2: '2'
        …
    })
                                                      //必返     |           |  String      |  get 参数格式字符串(首字符带 ? 号 )
    复制代码
    

      # 快速使用
    js 调用

    function fnOpenMap(){
        var _arr = [{
            type: 'iosamap',
            name: '高德地图'
        }, {
            type: 'baidumap',
            name: '百度地图'
        }, {
            type: 'comgooglemap',
            name: 'google地图'
        }],
        _param = {
            cancelTitle: '取消',
            buttons: []
        }
        _fnAppInstalled(0, function(){
            api.actionSheet(_param, function(ret, err) {
                var _temp = _arr[ret.buttonIndex-1];
                if( _temp ){
                    callMap.fnOpenMap({
                        type: _temp.type,
                        end: {
                            lat: 39.8411062307,
                            lon: 116.7566751225
                        }
                    })
                }
            });
        })
        function _fnAppInstalled(_num, _cb) {
            if (_num < _arr.length) {
                callMap.fnAppInstalled(_arr[_num].type, function(ret){
                    var _name = _arr[_num]['name'];
                    if (ret.installed) {
                    } else {
                        _name = _name + ' (未安装)';
                    }
                    _param.buttons.push(_name);
                    _fnAppInstalled(++_num, _cb);
                })
            } else {
                _cb && _cb();
            }
        }
    }
    复制代码
    

      

  • 相关阅读:
    Http的响应结构
    jQuery ajax
    什么是序列化和反序列化
    Ubuntu 安装 Anaconda3 步骤
    mysql 带换行符的字符串数据插入数据库异常
    Elasticsearch之Analysis(分析器)
    python 使用 xlrd、xlwd读写excel表格
    测试
    elasticsearch中的mapping简介
    Elasticsearch索引的操作,利用kibana 创建/删除一个es的索引及mapping映射
  • 原文地址:https://www.cnblogs.com/APICloud/p/13235967.html
Copyright © 2011-2022 走看看