<menuitem id="te8vo"></menuitem>
  • <div id="te8vo"><tr id="te8vo"><object id="te8vo"></object></tr></div>
  • <dl id="te8vo"></dl>
  • 頭像

    百度地圖顯示10個以上的標注點實例【原創

    來源:http://www.bdtes.com/php/3284.html 24***4k 2017-12-06 21:15瀏覽(3882) 收藏

    不必再為百度地圖api限制標注點的數量數量而煩惱了,幾行js代碼輕松搞定!
    百度地圖顯示10個以上的標注點實例
    分類:PHP > 統計圖+地圖 難易:中級

    程序員,你不是一個人;網站開發QQ群:735131011,在線充值,或聯系QQ2589223951直接充值

    查看演示 下載資源: 2 下載資源 下載火幣: 20 火幣
    解壓文件直接打開即可
    var doch = $(document).height() - 95;
    var taddress = '';
    taddress = '銀川市';
    var map = new BMap.Map("map-container");//在container容器中創建一個地圖,參數container為div的id屬性;
    map.centerAndZoom(taddress, 5);                //將point移到瀏覽器中心,并且地圖大小調整為15;
    map.addControl(new BMap.NavigationControl());
    map.addControl(new BMap.MapTypeControl());
    map.addControl(new BMap.ScaleControl());
    map.addControl(new BMap.OverviewMapControl());
    map.enableScrollWheelZoom();//啟動鼠標滾輪縮放地圖
    map.enableKeyboard();//啟動鍵盤操作地圖
    setTimeout(function() {
        $.each([{"short_name": "\u6807\u6CE8\u70B9", "address": "\u4E91\u5357\u7701\u6606\u660E\u5E02"}, {"short_name": "\u6807\u6CE8\u70B9", "address": "\u5E7F\u4E1C\u7701\u5E7F\u5DDE\u5E02"}, {"short_name": "\u6807\u6CE8\u70B9", "address": "\u798F\u5EFA\u7701\u798F\u5DDE\u5E02"}, {"short_name": "\u6807\u6CE8\u70B9", "address": "\u53F0\u6E7E\u7701\u53F0\u5317\u5E02"}, {"short_name": "\u6807\u6CE8\u70B9", "address": "\u56DB\u5DDD\u7701\u6210\u90FD\u5E02"}, {"short_name": "\u6807\u6CE8\u70B9", "address": "\u65B0\u7586\u4E4C\u9C81\u6728\u9F50"}, {"short_name": "\u6807\u6CE8\u70B9", "address": "\u91CD\u5E86\u5E02"}, {"short_name": "\u6807\u6CE8\u70B9", "address": "\u5170\u5DDE\u5E02"}, {"short_name": "\u6807\u6CE8\u70B9", "address": "\u94F6\u5DDD\u5E02"}, {"short_name": "\u6807\u6CE8\u70B9", "address": "\u90D1\u5DDE\u5E02"}, {"short_name": "\u6807\u6CE8\u70B9", "address": "\u5357\u4EAC\u5E02"}, {"short_name": "\u6807\u6CE8\u70B9", "address": "\u6D4E\u5357\u5E02"}, {"short_name": "\u6807\u6CE8\u70B9", "address": "\u5317\u4EAC\u5E02"}, {"short_name": "\u6807\u6CE8\u70B9", "address": "\u54C8\u5C14\u6EE8\u5E02"}, {"short_name": "\u6807\u6CE8\u70B9", "address": "\u6C88\u9633\u5E02"}, {"short_name": "\u6807\u6CE8\u70B9", "address": "\u547C\u548C\u6D69\u7279\u5E02"}, {"short_name": "\u6807\u6CE8\u70B9", "address": "\u5927\u8FDE\u5E02"}], function(index, item) {
            var iadd = item.address.substr(0, 32);
            $.getJSON('http://api.map.baidu.com/geocoder/v2/?address=' + iadd + '&output=json&ak=DYaq3yBlOfNVjYmedl31HEbU&callback=?',
                    function(data) {
                        var lng = data.result.location.lng;
                        var lat = data.result.location.lat;
                        var point = new BMap.Point(lng, lat);
                        var myIcon = new BMap.Icon("/Front/Public/images/MarkerIcon.png?v=20161129", new BMap.Size(10, 10), {
                            offset: new BMap.Size(5, 10), // 指定定位位置  
                            imageOffset: new BMap.Size(0, 0) // 設置圖片偏移  
                        });
    
                        var aaa = new BMap.Marker(point, {icon: myIcon});
                        map.addOverlay(aaa);
                        aaa.setZIndex('1');
                        var bbb = new BMap.Label(item.short_name, {offset: new BMap.Size(-24, -40)});
                        bbb.setStyle({height: '46px', color: '#fff', lineHeight: '46px', borderRadius: '26px', padding: '0px 6px', zIndex: '-1', background: '#b4a078', background:'rgba(180,160,120,0.9)'});
                        aaa.setLabel(bbb);
                    }
            );
        })
    }, 500)
    標簽: 百度地圖
    聲明:本文為原創文章,如需轉載,請注明來源sucaihuo.com并保留原文鏈接:http://www.bdtes.com/php/3284.html
    最新交易
    評論39
    頭像

    系統已開啟自動識別垃圾評論機制,識別到的自動封號,下載出錯或者資源有問題請聯系全棧客服QQ 2589223951

    • 頭像 38樓
      05-01 07:27
      hm***10
      這個很不錯,先留著慢慢看
    • 頭像 37樓
      04-25 08:56
      yu***赫赫
      下載下來看看,,看起來還不錯。
    • 頭像 36樓
      03-13 15:29
      ***
      真是啥都有啊 最近正在照這個東西
    • 頭像 35樓
      02-23 20:22
      He***ck
      這個就很不錯了看起來很實用的樣子
    • 頭像 34樓
      02-05 10:18
      ha***xi
      這個有用的到的地方,下載下來看看
    • 頭像 33樓
      02-05 08:30
      仿***者
      感覺好溜溜溜啊 正是我這幾天需要的 要學習
    • 頭像 32樓
      01-29 14:50
      u_***78
      有空了學學他調用百度地圖
    • 頭像 31樓
      01-26 11:03
      無***語
      百度地圖還可以這么玩啊,膜拜大神。
    • 頭像 30樓
      01-21 22:12
      西***俠
      看來很好用,下載下來看看
    • 頭像 29樓
      01-16 11:14
      xi***ng
      這個是不是調取定位的,不過看樣子好好用的樣子,我看看下載
    1 2
    江苏体彩11选五走势图