zoukankan      html  css  js  c++  java
  • 高德地图定位

    <input class="map_input_id" type="hidden" data-name-id="瑞泰口腔医院" data-map-wd="39.880629" data-tel-id="010-59361200" data-map-jd="116.388211" data-img-id="http://p0.meituan.net/dpdeal/c344a50facebd9eaa7e450589de44b4a117615.jpg%40450w_280h_1e_1c_1l%7Cwatermark%3D1%26%26r%3D1%26p%3D9%26x%3D5%26y%3D5%26relative%3D1" data-address-id="太平街甲6号富力摩根AB座底商(中央芭蕾舞蹈团对面)">
    set_map_child($('.map_input_id'));
    set_map_max($(".map_input_id"));
    function set_map_child(obj){
            var _this = obj;
            var wd = _this.attr("data-map-wd");
            var jd = _this.attr("data-map-jd");
            var address = _this.attr('data-address-id');
            var position = [jd,wd];
            var defaultLayer = new AMap.TileLayer();
            var traffic = new AMap.TileLayer.Traffic();
            var pp = {};
            pp.zoom = 15;
            pp.center = position;
            pp.resizeEnable = true;
            pp.isHotspot = true;
            var map = new AMap.Map('map_child_id', pp);
            var marker = new AMap.Marker({
                position: position,
                map:map
            });   
        }
        function set_map_max(obj){
            var _this = obj;
            var wd = _this.attr("data-map-wd");
            var jd = _this.attr("data-map-jd");
            var img = _this.attr('data-img-id');
            var address = _this.attr('data-address-id');
            var tel = _this.attr('data-tel-id');
            var name = _this.attr('data-name-id');
            var position = [jd,wd];
            var pp = {};
            pp.zoom = 15;
            pp.center = position;
            pp.resizeEnable = true;
            pp.isHotspot = true;
            var map = new AMap.Map('map_max_id', pp);
            var marker = new AMap.Marker({
                position: position,
                map:map
            });   
            //添加尺子,方向盘
            AMap.plugin(['AMap.ToolBar','AMap.Scale', 'AMap.OverView'],function(){
                var toolBar = new AMap.ToolBar();
                var scale = new AMap.Scale();
                var overView = new AMap.OverView({isOpen:true});
                map.addControl(toolBar);
                map.addControl(scale);
                map.addControl(overView);
            });
            //弹窗
            var marker = new AMap.Marker({
                position: position
            });
            marker.setMap(map);
            var circle = new AMap.Circle({
                center: position,
                radius: 100,
                fillOpacity:0.2,
                strokeWeight:1
            });
            circle.setMap(map);//设置范围圈
            marker.on('click',function(e){
                infowindow.open(map,e.target.getPosition());
            });
            AMap.plugin('AMap.AdvancedInfoWindow',function(){
                infowindow = new AMap.AdvancedInfoWindow({
                content: '<div class="info-title">'+name+'</div><div class="info-content">'+
                         '<img src="'+img+'">'+                         
                         '地址:'+address+'<br/>'+
                         '电话:'+tel+'<br/>'+
                         '</div>',
                offset: new AMap.Pixel(0, -30)
               });
               infowindow.open(map,position);
            });
        }
  • 相关阅读:
    浏览器内核
    link和@import的区别
    跨域iframe如何通信
    数组、对象基本操作
    浏览器兼容性问题
    微信H5开发
    前端面试整理
    js多维数组转一维数组
    js实现继承
    javascript函数闭包(closure)
  • 原文地址:https://www.cnblogs.com/300js/p/6090374.html
Copyright © 2011-2022 走看看