• harremanetarako

• euskara
• español
• english

OpenLayersExt.Popup.FramedB5MapMarker

OpenLayersExt klasea OLEaren Marker erakusleetan finkatutako FramedB5Map popupak sortzeko.

Baldintzak

• OpenLayersExtLoader.load metodoa abiarazi da.

• OpenLayersExt.Map mapa baten instantzia abiarazi da.

• OpenLayers.Layer.Markers geruza bat gehitu zaio.

• OpenLayers.LonLat-aren instantzia bat, non erakuslea jarri nahi den.

• OpenLayersExt.Marker erakusle bat gehitu zaio mapari.

Funtzioen deskribapena

FramedB5MapMarker batek OpenLayersExt.Marker erakusle batean finkatutako FramedB5Map popup-a sortzen du. Berez, erakuslearen gainean klik bakarra eginez, popupa bere egoeraren arabera minimizatuko edo maximizatuko du. Popuparen “itxi” botoian behin klik eginaz, popupa zein erakuslea kenduko da mapatik.

Nola erabili

Ole mapa baten instantzia eta erakuslea sortzen du:

var map    = new OpenLayersExt.Map("mymap"),   // mapa sortu
    marker = new OpenLayersExt.Marker(lonlat); // erakuslea sortu

Komenigarria izan daiteke zure aplikazioan pare bat metodo sortzea erakusleak gehitzeko lana arintzeko. Dokumentu honentzat, adibide ugari dituela eta, hauxe egin dugu:

map._getMarkerLayer = function(){    // erakusleen geruzara sartu eta oraindik existitzen ez bada, hura sortu
  if (!this._marker_layer){
     this._marker_layer = new OpenLayersExt.Layer.Markers(
       "nire_erakusleak", 
       { isBaseLayer:false } 
     );  // singleton bat naiz!
  }
  return this._marker_layer;
}.bind(map);
map._addMarker  = function(marker){  // erakuslea mapari gehitu eta Marker objektua itzuli
  this._getMarkerLayer().addMarker(marker);
  return marker;
}.bind(map);

Erakuslea mapari gehituko diogu eta gure FramedB5MapMarker popup-a jarri nahi dugun puntuan zentratuko dugu gure ikuspegia.

map._addMarker(marker);         // erakuslea gehituko diogu mapari
map.setCenter(lonlat);          // interesatzen zaigun puntuan zentratuko dugu mapa

Gure Map eta Markerra dugula, FramedB5MapMarker bat gehitu ahal izango diogu mapari honela:

var hello_popup = new OpenLayersExt.Popup.FramedB5MapMarker({        
    marker:   marker,
    content: "Kaixo <i>Popup</i>!"  // HTML eduki pixka bat popuparen barruan erakusteko
});
map.addPopup(hello_popup);          // popupa mapari gehitu

Nahi baduzu, zeure metodoa erabili dezakezu popupa eta hari lotutako erakuslea kentzeko:

map._removePopup = function removePopup(popup){
  this.getMarkerLayer().removeMarker(popup.marker);
  popup.marker.destroy();   // goodbye marker
  this.removePopup(popup);
  popup.destroy();          // goodbye popup
}.bind(map);

Hori egin duzunean, kode-lerro honekin desegin ahal izango dituzu zure popupak:

map._removePopup(hello_popup);

Egilea

• Honetatik hartuta: OpenLayers.Popup.FramedB5Map
  

  Parametroak:

  Izena	Mota	Deskribapena
  options	object	Aukeratzeko argumentuak dituen objektua (hash).

  
  options parametroa

  Izena	Mota	Deskribapena
  id	null	ID bakarra popuparentzat. Automatikoki sortua zehazten ez denean.
  marker	NOT NULL	OpenLayersExt.Marker erakuslearen instantzia
  lonlat	object	OpenLayers.LonLat-en instantzia koordenatuekin.
  content	string	HTML edukia popuparen barruan erakusteko.
  minimizeBox	boolean	Popuparen “ikonotu” botoia kentzeko aukera.
  minimizeBoxCallback	function	Popupapa minimizatzen den bakoitzean abiarazteko.
  minimized	boolean	Egoera minimizatuan dagoen popupa kargatzeko aukera.
  closeBox	boolean	Popuparen “itxi” botoia kentzeko aukera.
  closeBoxCallback	function	Popupa ixten denean jarrera gainidazteko aukera.
  onComplete	function	Popupa exekutatzen bukatu duenean abiarazteko.

Propietateak

Adibideak

OLEaren FramedB5MapMarker popup bat, lehenetsitako balioetatik igaroz:

var marker = map._addMarker(new OpenLayersExt.Marker(lonlat));
var popup  = new OpenLayersExt.Popup.FramedB5MapMarker({
  marker:               marker,                                 // erakuslea nahitaezkoa da eta ezin da null izan
  id:                   "b5map_popup_with_marker",              // ausazko katea, besterik esan ezean
  content:              "Some <strong>HTML</strong> content.",  // kate hutsa, besterik esan ezean: ""
  closeBox:             true,                                   // true, besterik esan ezean
  closeBoxCallback:     map._removePopup,                       // popupa eta bere markerra ezkutatzen du, besterik esan ezean
  minimizeBox:          true,                                   // true, besterik esan ezean
  minimizeBoxCallback:  function(){ /*alert("minimize cb!")*/ } // popupa ezkutatzen du, besterik esan ezean
});
map.addPopup(popup);

FramedB5MapMarker Popup minimizatu bat kargatu:

var marker = map._addMarker(new OpenLayersExt.Marker(lonlat));
var popup  = new OpenLayersExt.Popup.FramedB5MapMarker({
    id:                   "b5map_popup_minimized",          
    marker:               marker,
    content:              "Minimize by default by sending boolean argument \"minimized\" with a value of true.",
    closeBoxCallback:     map._removePopup,      
    minimized:            true     // load as minimized popup
});
map.addPopup(popup);

FramedB5MapMarker-Popup bat ixteko botoirik gabe:

var marker  = this.addMarkerToMap(new OpenLayersExt.Marker(lonlat));
var popup   = new OpenLayersExt.Popup.FramedB5MapMarker({
    id:           "framed-b5map-marker-without-closebox",          
    marker:       marker,
    content:      "Look, Mom! No closeBox! Just pass the closeBox parameter as false.",
    closeBox:     false
});
map.addPopup(popup);

FramedB5MapMarker Popup-a erakusle handiago eta itsusiagoarekin:

var marker = new OpenLayersExt.Marker(lonlat, {
  icon: OpenLayersExt.Marker.getIcon('http://img.fannation.com/upload/user_profile/image/199/608/thumb/hasselhoff.gif',50,50),
  style: { top:"-2px", background:"none" }
});
var popup = new OpenLayersExt.Popup.FramedB5MapMarker({
    content:              "Some <strong>HTML</strong> content.", 
    marker:               map._addMarker(marker),                   
    closeBoxCallback:     map._removePopup
});
map.addPopup(popup);

FramedB5MapMarker Popup kanpoko erakuslearekin eta itzalarekin:

var marker = new OpenLayersExt.Marker(lonlat, {
  icon: OpenLayersExt.Marker.getIcon('http://labs.google.com/ridefinder/images/mm_20_red.png',12,20),
  style: {
    background:"url(http://labs.google.com/ridefinder/images/mm_20_shadow.png)"
    ,width:   "22px"
    ,height:  "20px"
    ,left:    "-1px"
    ,top:     "-1px"
  }
});
var popup = new OpenLayersExt.Popup.FramedB5MapMarker({
    content:              "Some <strong>HTML</strong> content.", 
    marker:               map._addMarker(marker),                   
    closeBoxCallback:     map._removePopup
});
map.addPopup(popup);