گوجل ماپ اوورلیائی

ਗੂਗਲ ਮੈਪਸ - ਸੂਚੀ

ਸੂਚੀ ਮੈਪ 'ਤੇ ਅਕਸ਼ਾਂ/ਦ੍ਰਾਘਿਮਾਂ ਦੇ ਨਾਪ ਨਾਲ ਬੰਨ੍ਹੇ ਹੋਏ ਆਬਜੈਕਟ ਹਨ。

ਗੂਗਲ ਮੈਪਸ ਵਿੱਚ ਕਈ ਪ੍ਰਕਾਰ ਦੀਆਂ ਸੂਚੀਆਂ ਹਨ:

  • ਮਾਰਕਰ (Marker) - ਮੈਪ 'ਤੇ ਇੱਕ ਹੀ ਸਥਾਨ। ਮਾਰਕਰ ਨੂੰ ਵੀ ਪਰਿਭਾਸ਼ਿਤ ਆਇਕਾਨ ਚਿੱਤਰ ਦਿਖਾਇਆ ਜਾ ਸਕਦਾ ਹੈ
  • ਰੇਖਾ (Polyline) - ਮੈਪ 'ਤੇ ਇੱਕ ਲੜੀ ਦੀਆਂ ਰੇਖਾਵਾਂ
  • ਬਹੁਕੋਣੀ (Polygon) - ਮੈਪ 'ਤੇ ਇੱਕ ਲੜੀ ਦੀਆਂ ਰੇਖਾਵਾਂ ਜੋ 'ਬੰਦ' ਹੈ
  • ਸਮਕੇਂਦਰਿਤ ਅਤੇ ਚੌਕਾਰ (Circle ਅਤੇ Rectangle)
  • ਸੂਚਨਾ ਵਿੰਡੋ (Info Windows) - ਮੈਪ ਦੇ ਉੱਪਰ ਦਿਖਾਈ ਵਾਲੇ ਪੈਪ ਵਿੱਚ ਸਮਾਚਾਰ ਪ੍ਰਦਰਸ਼ਿਤ ਕਰਨਾ
  • ਪਰਿਭਾਸ਼ਿਤ ਕੀਤੀ ਸੂਚੀ (Custom overlays)

ਗੂਗਲ ਮੈਪਸ - ਮਾਰਕਰ ਜੋੜਨਾ

Marker ਬਣਾਉਣ ਵਾਲਾ ਕੰਸਟਰਕਟਰ ਮਾਰਕਰ ਬਣਾਉਣ ਲਈ ਵਰਤਿਆ ਜਾਂਦਾ ਹੈ। ਮਾਰਕਰ ਨੂੰ ਦਰਸਾਉਣ ਲਈ ਪੋਜ਼ੀਸ਼ਨ ਵਿਸ਼ੇਸ਼ਤਾ ਨੂੰ ਸੈਟ ਕਰਨਾ ਹੈ।

ਮਾਰਕਰ ਨੂੰ ਮੈਪ ਵਿੱਚ ਜੋੜਨ ਲਈ setMap() ਮੱਦਦ ਵਰਤੋਂ ਕਰੋ:

ਉਦਾਹਰਣ

var marker = new google.maps.Marker({position: myCenter});
marker.setMap(map);

ਗੂਗਲ ਮੈਪਸ - ਮਾਰਕਰ ਆਨੀਮੇਸ਼ਨ

ਹੇਠ ਦਾ ਉਦਾਹਰਣ ਇਹ ਪ੍ਰਦਰਸ਼ਿਤ ਕਰਦਾ ਹੈ ਕਿ ਕਿਵੇਂ animation ਵਿਸ਼ੇਸ਼ਤਾ ਦੀ ਵਰਤੋਂ ਕਰਕੇ ਮਾਰਕਰ ਨੂੰ ਆਨੀਮੇਸ਼ਨ ਕਰਨਾ ਹੈ:

ਉਦਾਹਰਣ

var marker = new google.maps.Marker({
  position:myCenter,
  animation:google.maps.Animation.BOUNCE
});
marker.setMap(map);

ਗੂਗਲ ਮੈਪਸ - ਆਇਕਾਨ ਵਾਲੇ ਮਾਰਕਰ

ਹੇਠ ਦਾ ਉਦਾਹਰਣ ਇਹ ਪ੍ਰਦਰਸ਼ਿਤ ਕਰਦਾ ਹੈ ਕਿ ਕਿਵੇਂ ਅਕਸ਼ਾਂ ਦੀ ਲੜੀ ਦੀ ਰੇਖਾ ਵਿੱਚ ਵਰਤਣਯੋਗ ਚਿੱਤਰ (ਆਇਕਾਨ) ਨੂੰ ਨਿਰਧਾਰਤ ਕਰਨਾ ਹੈ:

ਉਦਾਹਰਣ

var marker = new google.maps.Marker({
  position:myCenter,
  icon:'pinkball.png'
});
marker.setMap(map);

ਗੂਗਲ ਮੈਪਸ - ਰੇਖਾ

ਰੇਖਾ ਇੱਕ ਨਿਰਦੇਸ਼ਾਂ ਦੀ ਲੜੀ ਦੇ ਕਰਕੇ ਦਰਸਾਈ ਗਈ ਹੈ ਜੋ ਕਿ ਕਿਸੇ ਕਰਕੇ ਨਹੀਂ ਹੈ。

ਰੇਖਾ ਹੇਠ ਲਿਖੇ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਦਾ ਸਮਰਥਨ ਕਰਦੀ ਹੈ:

  • path - ਕੁਝ ਅਕਸ਼ਾਂ/ਦ੍ਰਾਘਿਮਾਂ ਦੇ ਨਿਯਮਤ ਅਕਸ਼ਾਂ ਦੀ ਰੇਖਾ
  • strokeColor - ਰੇਖਾ ਦਾ ਸੰਕੇਤਕ ਰੰਗ ਨਿਰਧਾਰਿਤ ਕਰੋ (ਫਾਰਮਟ: "#FFFFFF")
  • strokeOpacity - ਰੇਖਾ ਦੀ ਪਾਰਦਰਸ਼ਤਾ ਨਿਰਧਾਰਿਤ ਕਰੋ (0.0 ਤੋਂ 1.0 ਤੱਕ ਦਾ ਮੁੱਲ)
  • strokeWeight - ਰੇਖਾ ਦੀ ਚੌਕਸੀ ਨਿਰਧਾਰਿਤ ਕਰੋ (ਪਿਕਸਲ ਵਿੱਚ)
  • editable - ਇਹ ਸ਼ਾਇਦ ਵਿਅਕਤੀ ਕਰਕੇ ਸ਼ਾਰਟ ਸੰਪਾਦਨ ਕਰ ਸਕਦੇ ਹਨ (ਸਹੀ/ਗਲਤ)

ਉਦਾਹਰਣ

var myTrip = [stavanger,amsterdam,london];
var flightPath = new google.maps.Polyline({
  path:myTrip,,
  strokeColor:"#0000FF",
  strokeOpacity:0.8,,
  strokeWeight:2
});

ਗੂਗਲ ਮੈਪਸ - ਬਹੁਕੋਣੀ

ਬਹੁਕੋਣੀ ਅਤੇ ਚੰਗੀ ਤਰ੍ਹਾਂ ਦੇ ਸਮਾਨ ਹਨ ਕਿਉਂਕਿ ਦੋਵੇਂ ਕੋਰੀਡੀਨੇਟਸ ਦੀ ਇੱਕ ਲੜੀ ਨਾਲ ਬਣਾਈਆਂ ਜਾਂਦੀਆਂ ਹਨ। ਪਰ, ਬਹੁਕੋਣੀ ਬੰਦ ਖੇਤਰ ਨੂੰ ਨਿਰਧਾਰਿਤ ਕਰਨ ਲਈ ਬਣਾਈ ਜਾਂਦੀ ਹੈ。

ਬਹੁਕੋਣੀ ਰੇਖਾਵਾਂ ਦੁਆਰਾ ਬਣਾਈ ਜਾਂਦੀ ਹੈ ਅਤੇ ਇਸ ਦਾ ਰੂਪ "ਬੰਦ" ਹੁੰਦਾ ਹੈ (ਸਾਰੀਆਂ ਰੇਖਾਵਾਂ ਜੁੜੀਆਂ ਹੋਈਆਂ ਹਨ)。

ਬਹੁਕੋਣੀ ਨੂੰ ਨਿਮਨਲਿਖਤ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਸਮਰਥਿਤ ਹਨ:

  • path - ਰੇਖੇ ਦੇ ਕੁਝ ਅਕਸ਼ਾਂਕ ਅਤੇ ਲੰਬਾਈ ਨਿਰਧਾਰਿਤ ਕਰੋ (ਪਹਿਲਾ ਅਤੇ ਆਖਰੀ ਅਕਸ਼ਾਂਕ ਸਮਾਨ ਹੁੰਦੇ ਹਨ)
  • strokeColor - ਰੇਖਾ ਦਾ ਸੰਕੇਤਕ ਰੰਗ ਨਿਰਧਾਰਿਤ ਕਰੋ (ਫਾਰਮਟ: "#FFFFFF")
  • strokeOpacity - ਰੇਖਾ ਦੀ ਪਾਰਦਰਸ਼ਤਾ ਨਿਰਧਾਰਿਤ ਕਰੋ (0.0 ਤੋਂ 1.0 ਤੱਕ ਦਾ ਮੁੱਲ)
  • strokeWeight - ਰੇਖਾ ਦੀ ਚੌਕਸੀ ਨਿਰਧਾਰਿਤ ਕਰੋ (ਪਿਕਸਲ ਵਿੱਚ)
  • fillColor - ਬੰਦ ਖੇਤਰ ਦੇ ਰੰਗ ਨਿਰਧਾਰਿਤ ਕਰੋ (ਫਾਰਮਟ: "#FFFFFF")
  • fillOpacity - ਪੂਰਣ ਰੰਗ ਦੀ ਪਾਰਦਰਸ਼ਤਾ ਨਿਰਧਾਰਿਤ ਕਰੋ (0.0 ਤੋਂ 1.0 ਤੱਕ ਦਾ ਮੁੱਲ)
  • editable - ਇਹ ਸ਼ਾਇਦ ਵਿਅਕਤੀ ਕਰਕੇ ਸ਼ਾਰਟ ਸੰਪਾਦਨ ਕਰ ਸਕਦੇ ਹਨ (ਸਹੀ/ਗਲਤ)

ਉਦਾਹਰਣ

var myTrip = [stavanger,amsterdam,london,stavanger];
var flightPath = new google.maps.Polygon({
  path:myTrip,,
  strokeColor:"#0000FF",
  strokeOpacity:0.8,,
  strokeWeight:2,,
  fillColor:"#0000FF",
  fillOpacity:0.4
});

ਗੂਗਲ ਮੈਪਸ - ਗੋਲ

ਗੋਲ ਨੂੰ ਨਿਮਨਲਿਖਤ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਸਮਰਥਿਤ ਹਨ:

  • center - ਗੋਲ ਦੇ ਕੇਂਦਰ ਦਾ google.maps.LatLng ਨਿਰਧਾਰਿਤ ਕਰੋ
  • radius - ਗੋਲ ਦਾ ਵਾਧੂ ਦਾਇਰਾ ਨਿਰਧਾਰਿਤ ਕਰੋ (ਮੀਟਰ ਵਿੱਚ)
  • strokeColor - ਗੋਲ ਦੇ ਚੱਕਰ ਦੇ ਰੰਗ ਨਿਰਧਾਰਿਤ ਕਰੋ (ਫਾਰਮਟ: "#FFFFFF")
  • strokeOpacity - ਰੇਖੇ ਦੀ ਪਾਰਦਰਸ਼ਤਾ ਨਿਰਧਾਰਿਤ ਕਰੋ (0.0 ਤੋਂ 1.0 ਤੱਕ ਦਾ ਮੁੱਲ)
  • strokeWeight - ਰੇਖਾ ਦੀ ਚੌਕਸੀ ਨਿਰਧਾਰਿਤ ਕਰੋ (ਪਿਕਸਲ ਵਿੱਚ)
  • fillColor - ਗੋਲ ਦੇ ਅੰਦਰਲੇ ਖੇਤਰ ਦਾ ਸੰਕੇਤਕ ਰੰਗ ਨਿਰਧਾਰਿਤ ਕਰੋ (ਫਾਰਮਟ: "#FFFFFF")
  • fillOpacity - ਪੂਰਣ ਰੰਗ ਦੀ ਪਾਰਦਰਸ਼ਤਾ ਨਿਰਧਾਰਿਤ ਕਰੋ (0.0 ਤੋਂ 1.0 ਤੱਕ ਦਾ ਮੁੱਲ)
  • editable - ਵਿਅਕਤੀ ਕਰਕੇ ਗੋਲ ਸੰਪਾਦਨ ਕਰ ਸਕਦੇ ਹਨ (ਸਹੀ/ਗਲਤ)

ਉਦਾਹਰਣ

var myCity = new google.maps.Circle({
  center:amsterdam,,
  radius:20000,,
  strokeColor:"#0000FF",
  strokeOpacity:0.8,,
  strokeWeight:2,,
  fillColor:"#0000FF",
  fillOpacity:0.4
});

ਗੂਗਲ ਮੈਪਸ - ਸੂਚਨਾ ਵਿੰਡੋ

marker ਲਈ ਪਾਠ ਵਾਲੀ ਸੂਚਨਾ ਵਿੰਡੋ ਦਿਖਾਉਣ ਲਈ:

ਉਦਾਹਰਣ

var infowindow = new google.maps.InfoWindow({
  content:"Hello World!"
});
infowindow.open(map,marker);