高い道徳的なマップ - 新しいラベルとしては、位置を切り替えます

要件：

1.地図と地図表示レベルの中心点を任意に設定、及び中心点にマーカーを追加しています。

2.小さな手のためのマウスのようなスタイルを設定します。

3.イベントをバインドする前のマークがクリアする必要がありながら、所定の位置にマーカーをクリックして追加するには、地図上をクリックしてください。

（ビデオの具体的な効果の影響を参照してください）

タスク（ステップ）：

1）（新しいAMap.Mapを使用してマップを作成します。

2.地図の中心点と、地図表示レベルを任意に設定し、地図の中心にマークを追加するAMap.Marker（）メソッドを使用しています

3.マウスのスタイルのような小さな手のsetDefaultCursorの設定方法

イベントを結合4.マップ、前のマークをクリアするmap.remove（）メソッドを使用する必要がありながら、所定の位置にクリックタグを追加します。

<！DOCTYPE HTML> 
<HTML> 
    <HEAD> 
        <メタ文字セット= " UTF-8 " > 
        <スクリプトタイプ= " テキスト/ javascriptの" SRC = " https://webapi.amap.com/maps?v=1.4.11&key = 9de88a718781910c9a1c81230827d1ce＆プラグイン= AMap.Autocomplete、AMap.PlaceSearch " > </ SCRIPT> 
        <タイトル> 5 -4添加标记练习</タイトル> 
        <スタイル> 
            * { 
                パディング：0 。
                マージン：0 ;
                トップ：
                左：0 ; 
                幅：100％; 
                高さ：100％; 
            } </スタイル> 
    </ head> 
    <body> 
        <DIV ID = " コンテナ" > </ div> 
        <スクリプト> VARの地図= 新しい AMap.Map（' コンテナー' 、{ 
                ズーム：10 、
                中央：[ 116.379391、39.861536 ] 
            }）。
        
        
            
            
            地図。ポインタ" ）; 
            
            VaRのマーカー= 新しいAMap.Marker（{ 
                アイコン：' https://a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png ' 、
                位置：[ 116、39 ] 
            }）
            
            map.on（' クリック' 、関数の（e）{ 
                map.remove（[マーカー]）
                マーカー = 新しいAMap.Marker（{ 
                    アイコン：https://a.amap.com/jsapi_demos/static/demo-center/icons /poi-marker-default.png " 、 "
                    位置：[e.lnglat.lng、e.lnglat.lat]、
                    オフセット：新しい AMap.Pixel（ - 10、 - 20 ）
                }）。
                
                map.add（[マーカ]）。
            }）
            
         </ SCRIPT> 
    </ body> 
</ HTML>

高い道徳的なマップ - 新しいラベルとしては、位置を切り替えます

おすすめ