亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專欄INFORMATION COLUMN

高德地圖 Javascript API 入門(四)

AlanKeene / 3131人閱讀

摘要:高德地圖入門四地圖覆蓋物覆蓋物類名說明是否插件點標(biāo)記否覆蓋物點標(biāo)記復(fù)雜點標(biāo)記對象,對普通點標(biāo)記的擴展否覆蓋物折線否覆蓋物多邊形否覆蓋物圓否圖片覆蓋物否地圖右鍵菜單否點標(biāo)記預(yù)覽自定義點標(biāo)記預(yù)覽多邊形預(yù)覽右鍵菜單添加右鍵菜單內(nèi)容項放大縮小添加

高德地圖 Javascript API 入門(四) 地圖覆蓋物 覆蓋物
類名 說明 是否插件
AMap.Marker 點標(biāo)記
AMap.Icon 覆蓋物>點標(biāo)記>復(fù)雜點標(biāo)記對象,對普通點標(biāo)記Marker 的擴展
AMap.Polyline 覆蓋物>折線
AMap.Polygon 覆蓋物>多邊形
AMap.Circle 覆蓋物>圓
AMap.GroundImage 圖片覆蓋物
AMap.ContextMenu 地圖右鍵菜單
#### 點標(biāo)記 JS
    var marker=new AMap.Marker({
        map:map,
        position:new AMap.LngLat(112.736465,37.696495)
    });

預(yù)覽

自定義點標(biāo)記

JS

    var marker=new AMap.Marker({
        map:map,
        position:new AMap.LngLat(112.736465,37.696495),
        icon:new AMap.Icon({
            image:"https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=2803620233,1906638381&fm=23&gp=0.jpg",
            size:[72,72],
            imageSize:[36,36]
        }),
        draggable:true,
        raiseOnDrag:true,
        shape:new AMap.MarkerShape({
            type:"circle",
            coords:[112.736465,37.696495,100]
        }),
        label:{
            content:"label",
            offset:new AMap.Pixel(0,-36)
        }
    });

預(yù)覽

多邊形

JS

    var lineArr=[
        [112.49157,37.897392],
        [112.602806,37.898747],
        [112.608643,37.797355],
        [112.49775,37.79627]
    ];
    var polygon=new AMap.Polygon({
        map:map,
        path:lineArr
    });

預(yù)覽

右鍵菜單

JS

    var contextmenu=new AMap.ContextMenu();
    var pos=[];
    // 添加右鍵菜單內(nèi)容項
    contextmenu.addItem("放大",function () {
        map.zoomIn();
    },0);
    contextmenu.addItem("縮小",function () {
        map.zoomOut();
    },1);
    contextmenu.addItem("添加點標(biāo)記",function () {
        var marker=new AMap.Marker({
            map:map,
            position:pos
        });
    },2);
    // 監(jiān)聽鼠標(biāo)右擊事件
    map.on("rightclick",function (e) {
        contextmenu.open(map,e.lnglat);
        pos=e.lnglat;
    });

預(yù)覽

信息窗體 信息窗體

JS

    var infowindow=new AMap.InfoWindow({
        isCustom:false,
        content:"

Hello,Yuanping

", offset:new AMap.Pixel(0,-36), showShadow:true, closeWhenClickMap:true, autoMove:true }); infowindow.open(map,new AMap.LngLat(112.736465,38.696495));

預(yù)覽

小練習(xí) 鼠標(biāo)劃過山西大劇院時,彈出信息窗體

JS

    // 坐標(biāo)
    var lineArr=[
        [112.532802,37.808395],
        [112.533049,37.808395],
        [112.533124,37.808476],
        [112.533521,37.808459],
        [112.533558,37.808391],
        [112.533832,37.808391],
        [112.533848,37.80792],
        [112.534159,37.807959],
        [112.534159,37.80748],
        [112.533826,37.807514],
        [112.533832,37.807179],
        [112.533966,37.806848],
        [112.533376,37.806683],
        [112.533054,37.806687],
        [112.532684,37.806878],
        [112.53278,37.807191],
        [112.532796,37.80745],
        [112.532013,37.807285],
        [112.532019,37.808213],
        [112.532796,37.808018],
        [112.532818,37.808412]
    ];
    // 實例化Polygon類
    var polygon=new AMap.Polygon({
        map:map,
        path:lineArr
    });
    // 適應(yīng)窗口
    map.setFitView();
    // 實例化信息窗體類
    var infowindow=new AMap.InfoWindow({
        content:"

太原市

山西大劇院

", closeWhenClickMap:true }); // 監(jiān)聽鼠標(biāo)移入、移除事件 polygon.on("mouseover",function (e) { infowindow.open(map,map.getCenter()); }).on("mouseout",function () { infowindow.close(); });

預(yù)覽

參考來源:http://lbs.amap.com/
作者:Yangfan

文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址:http://www.ezyhdfw.cn/yun/81678.html

相關(guān)文章

  • 高德地圖 Javascript API 入門(一)

    摘要:高德地圖入門一準(zhǔn)備工作首先注冊個開發(fā)者賬號然后創(chuàng)建應(yīng)用,獲取新建文件,在標(biāo)簽中引入如下代碼把你的值填入即可您申請的值創(chuàng)建設(shè)置地圖容器地圖初始化創(chuàng)建地圖設(shè)置地圖參數(shù)可以通過以下設(shè)置也可通過對象的方法設(shè)置預(yù)覽個性化地圖改變地圖樣式目前支持五種地 高德地圖 Javascript API 入門(一) 準(zhǔn)備工作 首先注冊個開發(fā)者賬號 showImg(https://segmentfault.co...

    jone5679 評論0 收藏0
  • 高德地圖 Javascript API 入門(二)

    摘要:鼠標(biāo)在地圖上拉框即可繪制相應(yīng)的矩形。鼠標(biāo)在地圖上單擊繪制量測區(qū)域,鼠標(biāo)左鍵雙擊或右鍵單擊結(jié)束當(dāng)前量測操作,并顯示本次量測結(jié)果。參數(shù)設(shè)為時,鼠標(biāo)操作關(guān)閉的同時清除地圖上繪制的所有覆蓋物對象設(shè)為時,保留所繪制的覆蓋物對象。 高德地圖 Javascript API 入門(二) 鼠標(biāo)工具插件 測量距離 JS map.plugin([AMap.MouseTool],function ()...

    dockerclub 評論0 收藏0
  • 高德地圖 Javascript API 入門(七)

    摘要:高德地圖入門七熱力圖插件簡單例子顯示地圖坐標(biāo)點加載熱力圖插件預(yù)覽參數(shù)構(gòu)造函數(shù)說明構(gòu)造一個熱力圖插件對象,為要疊加熱力圖的地圖對象,屬性參考列表中的說明。 高德地圖 Javascript API 入門(七) 熱力圖插件 簡單例子 // 顯示地圖 var map=new AMap.Map(container,{ resizeEnable:true, center:[116....

    YuboonaZhang 評論0 收藏0
  • 高德地圖 Javascript API 入門(六)

    摘要:高德地圖入門六出行規(guī)劃公交路徑公交換乘服務(wù),提供起終點公交路線規(guī)劃服務(wù),整合步行方式初始化加載公交線路插件實例化北京必須值,搭乘公交所在城市可選值,搜索結(jié)果的標(biāo)注線路等均會自動添加到此地圖上可選值,顯示搜索列表的容器可選值,詳細(xì)信息駕駛策略 高德地圖 Javascript API 入門(六) 出行規(guī)劃 公交路徑 公交換乘服務(wù),提供起、終點公交路線規(guī)劃服務(wù),整合步行方式 初始化 // 加...

    idisfkj 評論0 收藏0
  • 高德地圖 Javascript API 入門(三)

    摘要:高德地圖入門三距離測量插件區(qū)別雖然鼠標(biāo)工具插件也提供距離量測功能,但是距離量測插件,提供更為豐富的樣式設(shè)置功能。 高德地圖 Javascript API 入門(三) 距離測量插件 區(qū)別 雖然鼠標(biāo)工具插件也提供距離量測功能,但是距離量測插件,提供更為豐富的樣式設(shè)置功能。 加載插件 JS map.plugin([AMap.RangingTool],function () { ...

    EdwardUp 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<