zoukankan      html  css  js  c++  java
  • Create Layer on google map

    There are five common google layers.

    *google.maps.Marker;*google.maps.InfoWindow;*google.maps.PolyLine;*google.maps.Polygon;*google.maps.Circle;

    1.Maker's properties:

      *position:LatLng; ==> position.

      *map: google.maps.Map; ==>this maker display on which map or use maker.setMap(map); {makert.setMap(null), which use to remove a marker from the map}

      *title: 'string';

      *draggable: false;

      *animation: google.maps.Animation.DROP;google.maps.Animation.BOUNCE; / marker.setAnimation();

      *label:'string' ==>A marker label is a single textual character that appears inside a marker;

      *icon:image;

      *shape:shape;

    2.InfoWindow's properties: InfoWindow displays content(usually text or images) in a popup window above the map, at a given location; typically you will attach an info window to a marker, but you can also attach an info window to a specific latitude/longitude.

      *content:'string';

      *position:LatLng;

      *maxWidth:number;

      *Infowindow.close();close a info window.

      *move an info window: call setPosition() or infoWindow.open();

    3.Polyline's properties: To draw a line on your map.

      *strokeColor: "#FFFFFF";

      *strokeOpacity: 0.0 to 1.0;

      *strokeWeight: number;

      *setMap(map); //setMap(null);==>remove a polyline

      *getPath(); ==>return polyline instance

      *push(latlng);

      *getLength();

      *customize a polyline: See Symbols.

    3. Polygon's properties: represents an area enclosed by a closed path.

      *paths: triangleCoords;  var triangleCoords = [{lat: 25.774, lng: -80.190},{lat: 18.466, lng: -66.118},{lat: 32.321, lng: -64.757}];

      *strokeColor:'#FF0000';

      *strokeOpacity:0.8;

      *strokeWeight: number;

      *fillColor:'#0000FF';

      *fillOpacity:0.35;

      *setMap(map); //setMap(null);

      *getPath()

     4. Circle: center, strokeColor, strokeOpacity, strokeWeight, radius, fillColor, fillOpacity, editable.

    ===>

    google.maps.event.addListener(marker,'click', nameoffunction);

    or

    marker.addListener('click',nameoffunction);

    ==>可以在UI事件里acquire到event的parameter

    marker.addListener('click',function(e){});

  • 相关阅读:
    mysql用 法like concat()
    redis系列之数据库与缓存数据一致性解决方案
    day33:进程锁&事件&进程队列&进程间共享数据
    day32:进程&进程join&守护进程deamon
    day31:socketserver&hashlib&hmac&TCP登录
    day30:TCP&UDP:socket
    day29:计算机网络概念
    小程序3:ATM小程序
    hdu 6867 Tree 2020 Multi-University Training Contest 9 dfs+思维
    Codeforces Round #660 (Div. 2) Captain Flint and Treasure 拓扑排序(按照出度、入读两边拓扑排序)
  • 原文地址:https://www.cnblogs.com/yeatschen/p/5420946.html
Copyright © 2011-2022 走看看