PrimeFaces – OrderList Ve GMap

Merhabalar arkadaşlar. Bu yazıda sizlerle PrimeFaces’ın OrderList ve GMap bileşenini inceleyeceğiz.

OrderList Bileşeni

OrderList liste içerisindeki elemanların yerlerini değiştirip kullanabildiğimiz bir bileşendir. İster drag&drop ister yanındaki butonlar vasıtası ile kullanabilirsiniz. Şimdi örnek kod ve ekran çıktısı ile kullanımına bakalım.

orderList.xhtml

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://xmlns.jcp.org/jsf/core"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets">
    <h:head>
        <title>OrderList Bileşeni</title>
    </h:head>
    <h:body>
        <h:form>
            <p:orderList controlsLocation="right" converter="tutorConverter" value="#{orderListBean.tutorList}" itemValue="#{tutor}" var="tutor">
                <f:facet name="caption">Java Hocalarımız</f:facet>
                
                <p:column>
                    <h:outputText value="#{tutor.name} #{tutor.surname} #{tutor.company}"/>
                </p:column>
                
            </p:orderList>
            
            <p:commandButton value="Gönder" update="gridPanel"  oncomplete="PF('dialogWindow').show()"/>
            
            <p:dialog id="dialogWindow" width="400" header="Hocalarımız" modal="true" widgetVar="dialogWindow" showEffect="fade" hideEffect="fade">
                <h:panelGrid columns="3" id="gridPanel">
                    <ui:repeat value="#{orderListBean.tutorList}" var="tutor">
                        <h:outputText  value="#{tutor.name} #{tutor.surname} #{tutor.company}"/>
                        <br/>
                    </ui:repeat>
                </h:panelGrid>
            </p:dialog>
        </h:form>
    </h:body>
</html>

<?xml version='1.0' encoding='UTF-8' ?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"

xmlns:h="http://xmlns.jcp.org/jsf/html"

xmlns:p="http://primefaces.org/ui"

xmlns:f="http://xmlns.jcp.org/jsf/core"

xmlns:ui="http://xmlns.jcp.org/jsf/facelets">

<h:head>

<title>OrderList Bileşeni</title>

</h:head>

<h:body>

<h:form>

<p:orderList controlsLocation="right" converter="tutorConverter" value="#{orderListBean.tutorList}" itemValue="#{tutor}" var="tutor">

<f:facet name="caption">Java Hocalarımız</f:facet>

<p:column>

<h:outputText value="#{tutor.name} #{tutor.surname} #{tutor.company}"/>

</p:column>

</p:orderList>

<p:commandButton value="Gönder" update="gridPanel" oncomplete="PF('dialogWindow').show()"/>

<p:dialog id="dialogWindow" width="400" header="Hocalarımız" modal="true" widgetVar="dialogWindow" showEffect="fade" hideEffect="fade">

<h:panelGrid columns="3" id="gridPanel">

<ui:repeat value="#{orderListBean.tutorList}" var="tutor">

<h:outputText value="#{tutor.name} #{tutor.surname} #{tutor.company}"/>

<br/>

</ui:repeat>

</h:panelGrid>

</p:dialog>

</h:form>

</h:body>

</html>

Biz orderList bileşenimizi p:orderList etiketi ile kullanıyoruz. Bu etiketin özelliklerine göz atalım:

controlsLocation aşağı yukarı işlemlerini yapacak butonların orderList bileşenin sağında ya da solunda görünmesine karar veren özelliktir. Alabileceği parametreler letf,right ve none‘dır. None değeri atamanız durumunda butonlar görünmeyecektir. Özelliğin kullanılmaması durumunda varsayılan olarak solda yer alır.
converter özelliği ile yazmış olduğumuz dönüştürücü sınıfı atıyoruz. OrderList bileşenimizi kullanırken ben converter kullanmadan bileşeni yazmaya çalıştığımda

The class 'java.lang.String' does not have the property 'değişkenAdı'

1

The class 'java.lang.String' does not have the property 'değişkenAdı'

şeklinde bir hata aldım hep. Bu hatanın üstesinden gelmenin ve kurtulmanın yolu orderList bileşeninin converter özelliğini kullanmaktır.
value özelliği ile ekranda görünecek değerlerin barındığı listeyi atıyoruz.
itemValue özelliği her ne kadar IDE tarafından kod yazımı sırasında kullanılmaya zorlanmasa da kullanılması bizim faydamızadır. Converter kullanımı sırasında nesnelerin geçişi için gereklidir.
var özelliğini de DataTable’dan hatırlarsınız. Değerleri ekrana basarken kullandığımız özellik.

p:column etiketi ile DataTable benzeri şekilde açılan bir kolona gerekli bilgileri yazdırıyoruz.

p:commandButton ile yazdığımız butonu önceki derslerimizdeki gibi yazdık ve dialog’u açacak ve içindeki grid’i güncelleyecek şekilde hazırladık.

Dialog içerisinde de bir grid’in içinde ui:repeat etiketi ile verilerin güncel halini ekrana yazdırıyoruz. Burada isterseniz DataTable’da kullanabilirsiniz. Tercih size kalmış.

OrderListBean.java

package orderList;

import java.io.Serializable;
import java.util.ArrayList;
import java.util.List;

import javax.annotation.PostConstruct; 
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;

@ManagedBean 
@SessionScoped
public class OrderListBean implements Serializable{
    List<Tutors> tutorList;

    public List<Tutors> getTutorList() {
        return tutorList;
    }

    public void setTutorList(List<Tutors> tutorList) {
        this.tutorList = tutorList;
    }
    
    @PostConstruct
    public void initialize()
    {
        tutorList=new ArrayList<>();
        
        Tutors rahmanHoca=new Tutors("Rahman", "Usta", "kodcu.com");
        Tutors akinHoca=new Tutors("Akın", "Kaldıroğlu", "SelSoft Acamedy");
        Tutors cagatayHoca=new Tutors("Çağatay", "Çivici", "Prime Technology");
        
        tutorList.add(new Tutors("Rahman", "Usta", "kodcu.com"));
        tutorList.add(new Tutors("Akın", "Kaldıroğlu", "SelSoft Acamedy"));
        tutorList.add(cagatayHoca);
        
    } 
}

package orderList;

import java.io.Serializable;

import java.util.ArrayList;

import java.util.List;

import javax.annotation.PostConstruct;

import javax.faces.bean.ManagedBean;

import javax.faces.bean.SessionScoped;

@ManagedBean

@SessionScoped

public class OrderListBean implements Serializable{

List<Tutors> tutorList;

public List<Tutors> getTutorList() {

return tutorList;

}

public void setTutorList(List<Tutors> tutorList) {

this.tutorList = tutorList;

}

@PostConstruct

public void initialize()

{

tutorList=new ArrayList<>();

Tutors rahmanHoca=new Tutors("Rahman", "Usta", "kodcu.com");

Tutors akinHoca=new Tutors("Akın", "Kaldıroğlu", "SelSoft Acamedy");

Tutors cagatayHoca=new Tutors("Çağatay", "Çivici", "Prime Technology");

tutorList.add(new Tutors("Rahman", "Usta", "kodcu.com"));

tutorList.add(new Tutors("Akın", "Kaldıroğlu", "SelSoft Acamedy"));

tutorList.add(cagatayHoca);

}

Java sınıfımız içinde @PostConstruct ile listenin oluşturulması ve doldurulması işlemleri gerçekleştiriliyor.

TutorConverter.java

package orderList;

import java.util.ArrayList;
import java.util.List;
import javax.faces.application.FacesMessage;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ManagedProperty;
import javax.faces.component.UIComponent;
import javax.faces.context.FacesContext;
import javax.faces.convert.Converter;
import javax.faces.convert.ConverterException;
import javax.faces.convert.FacesConverter;
 
@FacesConverter("tutorConverter")
public class TutorConverter implements Converter {
     List<Tutors> tutorList=new ArrayList<>();
     
    @Override    
    public Object getAsObject(FacesContext fc, UIComponent uic, String value) {
         
        System.out.println("Gelen Value:" + value);
        if (value != null && value.trim().length() > 0) {
            try {
                String[] dizi = value.split(",");
                for (int i = 0; i < dizi.length; i++) 
                {
                    System.out.println(dizi[i]);
                }
                Tutors tutor = new Tutors();
                tutor.setName(dizi[0]);
                tutor.setSurname(dizi[1]);
                tutor.setCompany(dizi[2]); 
                return tutor;
            } 
            catch (Exception e) 
            {
                System.err.println("Hata Meydana Geldi\\n:" + e);
                throw new ConverterException(new FacesMessage(FacesMessage.SEVERITY_ERROR, "Conversion Error", "Not a valid theme."));
            }
        } else {
            return null;
        }
    }
  
    public String getAsString(FacesContext fc, UIComponent uic, Object object) {
        if(object != null) 
        {  
            return String.valueOf(((Tutors)object).getName())+","+String.valueOf(((Tutors)object).getSurname())+","+String.valueOf(((Tutors)object).getCompany());  
        }
        else 
        {
            return null;
        }
    }   
}

package orderList;

import java.util.ArrayList;

import java.util.List;

import javax.faces.application.FacesMessage;

import javax.faces.bean.ManagedBean;

import javax.faces.bean.ManagedProperty;

import javax.faces.component.UIComponent;

import javax.faces.context.FacesContext;

import javax.faces.convert.Converter;

import javax.faces.convert.ConverterException;

import javax.faces.convert.FacesConverter;

@FacesConverter("tutorConverter")

public class TutorConverter implements Converter {

List<Tutors> tutorList=new ArrayList<>();

@Override

public Object getAsObject(FacesContext fc, UIComponent uic, String value) {

System.out.println("Gelen Value:" + value);

if (value != null && value.trim().length() > 0) {

try {

String[] dizi = value.split(",");

for (int i = 0; i < dizi.length; i++)

{

System.out.println(dizi[i]);

}

Tutors tutor = new Tutors();

tutor.setName(dizi[0]);

tutor.setSurname(dizi[1]);

tutor.setCompany(dizi[2]);

return tutor;

}

catch (Exception e)

{

System.err.println("Hata Meydana Geldi\\n:" + e);

throw new ConverterException(new FacesMessage(FacesMessage.SEVERITY_ERROR, "Conversion Error", "Not a valid theme."));

}

} else {

return null;

}

public String getAsString(FacesContext fc, UIComponent uic, Object object) {

if(object != null)

{

return String.valueOf(((Tutors)object).getName())+","+String.valueOf(((Tutors)object).getSurname())+","+String.valueOf(((Tutors)object).getCompany());

}

else

{

return null;

}

Converter sınıfımız içinde önce getAsString metodu ile gelen Object nesnesinden istediğimiz biçimde bir String elde ediyoruz ve akabinde getAsObject metodu ile hangi veri tipinde bir nesne istiyorsak gelen String nesnesini kullanıp nesnemizi döndürüyoruz. Burada bir Tutors nesnesi oluşturup, gelen String’den verileri alıp koyduk ve onu döndürdük.

Tutors.java

package orderList;

import java.io.Serializable;

public class Tutors implements Serializable
{      
    String name;
    String surname;
    String company;
    
    public Tutors()
    {
        
    } 
    
    public Tutors(String name,String surname,String company)
    {
        this.name=name;
        this.surname=surname;
        this.company=company;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public String getSurname() {
        return surname;
    }

    public void setSurname(String surname) {
        this.surname = surname;
    }

    public String getCompany() {
        return company;
    }

    public void setCompany(String company) {
        this.company = company;
    }
    
}

package orderList;

import java.io.Serializable;

public class Tutors implements Serializable

{

String name;

String surname;

String company;

public Tutors()

{

}

public Tutors(String name,String surname,String company)

{

this.name=name;

this.surname=surname;

this.company=company;

}

public String getName() {

return name;

}

public void setName(String name) {

this.name = name;

}

public String getSurname() {

return surname;

}

public void setSurname(String surname) {

this.surname = surname;

}

public String getCompany() {

return company;

}

public void setCompany(String company) {

this.company = company;

}

POJO niteliğindeki Tutors sınıfımız.

Ekran Çıktımız

Sayfa açıldığındaki hali.

Sürükle bırak yöntemi ile Çağatay Çivici’yi yukarı taşıyorum. Rahman Ustayı sağdaki butonlar ile aşağı taşıdım.

GMap Bileşeni

PrimeFaces geliştiricileri Google’in harita servisini alıp kütüphaneye uygulamışlar ve bizim bir tag vasıtası ile bu servisi kullanmamıza imkan tanımışlar. Örnekler üzerinden kullanıma bakalım.

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:p="http://primefaces.org/ui">
    <h:head>
        <title>Facelet Title</title>
        <script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>

    </h:head>
    <h:body>
        <h:form>
            <p:gmap center="41.008008, 28.978859" zoom="18" type="HYBRID" style="width:100%;height:400px"/>
        </h:form>
    </h:body>
</html>

<?xml version='1.0' encoding='UTF-8' ?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"

xmlns:h="http://xmlns.jcp.org/jsf/html"

xmlns:p="http://primefaces.org/ui">

<h:head>

<title>Facelet Title</title>

</h:head>

<h:body>

<h:form>

<p:gmap center="41.008008, 28.978859" zoom="18" type="HYBRID" style="width:100%;height:400px"/>

</h:form>

</h:body>

</html>

Birinci örneğimizde temel kullanımı görüyoruz. Temel kullanım tanımlanması zorunlu olan center, zoom ve type özelliklerinin kullanıldığı şekle karşılık geliyor. Center göstermek istediğimiz yerin koordinatlarını,zoom yakınlaştırmayı temsil ediyor. Koordinatlar Ayasofya’nın koordinatları 🙂

İkinci örneğimizde bir yere marker nasıl koyulur onu görelim. Bir çok sitede bir yerin adresi gösterilirken marker (kırmızı işaretçi) ile işaretlendiğini görürüz.

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:p="http://primefaces.org/ui">
    <h:head>
        <title>GMap Kullanımı</title>
        <script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
    </h:head>
    <h:body>
        <h:form>
            <p:gmap center="39.912242, 32.848524999999995" type="HYBRID" model="#{markerBean.mapModelObject}" zoom="18" style="width:100%;height:400px"/>
        </h:form>    
    </h:body>
</html>

<?xml version='1.0' encoding='UTF-8' ?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"

xmlns:h="http://xmlns.jcp.org/jsf/html"

xmlns:p="http://primefaces.org/ui">

<h:head>

<title>GMap Kullanımı</title>

</h:head>

<h:body>

<h:form>

<p:gmap center="39.912242, 32.848524999999995" type="HYBRID" model="#{markerBean.mapModelObject}" zoom="18" style="width:100%;height:400px"/>

</h:form>

</h:body>

</html>

Marker kullanmak istediğimiz zaman yapmamız gereken Java kodumuz içinde bir MapModel nesnesi tanımlaması yapmak ve bunu model özelliğine atıyoruz.

package gmap;

import java.io.Serializable;
import javax.annotation.PostConstruct;
import javax.faces.bean.ManagedBean;
 
import org.primefaces.model.map.DefaultMapModel;
import org.primefaces.model.map.LatLng;
import org.primefaces.model.map.MapModel;
import org.primefaces.model.map.Marker;
 
@ManagedBean
public class MarkerBean implements Serializable {
    
    private MapModel mapModelObject;
  
    @PostConstruct
    public void init() {
        mapModelObject = new DefaultMapModel();
          
        LatLng TBMMcoordinate = new LatLng(39.912242, 32.848524999999995);
          
        mapModelObject.addOverlay(new Marker(TBMMcoordinate, "TBMM"));
    }

    public MapModel getMapModelObject() {
        return mapModelObject;
    }
}

package gmap;

import java.io.Serializable;

import javax.annotation.PostConstruct;

import javax.faces.bean.ManagedBean;

import org.primefaces.model.map.DefaultMapModel;

import org.primefaces.model.map.LatLng;

import org.primefaces.model.map.MapModel;

import org.primefaces.model.map.Marker;

@ManagedBean

public class MarkerBean implements Serializable {

private MapModel mapModelObject;

@PostConstruct

public void init() {

mapModelObject = new DefaultMapModel();

LatLng TBMMcoordinate = new LatLng(39.912242, 32.848524999999995);

mapModelObject.addOverlay(new Marker(TBMMcoordinate, "TBMM"));

}

public MapModel getMapModelObject() {

return mapModelObject;

}

init metodu içinde mapModelObject nesnesini oluşturuyoruz. Akabinde koordinatları tanımladığımız bir LatLng nesnesi tanımlıyoruz ve yapılandırıcıya koordinatları parametre olarak geçiriyoruz. Son olarak MapModel nesnemizin addOverlay metodunu bir Marker nesnesini parametre olarak vererek çağırıyoruz. Marker nesnesinin oluşturulması sırasında 2 parametre veriliyor. Bunlar koordinatları barındıran LatLng nesnesi ve marker’ın ismidir.

Aşağıdaki resimde de görebileceğiniz gibi TBMM’yi marker ile gösterdik.

Şimdi son olarak da arama ile bulunan bir yerin gösterilmesine bakalım.

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:p="http://primefaces.org/ui">
    <h:head>
        <title>GMap Kullanımı</title>
        <script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
    </h:head>
    <h:body>
        <script type="text/javascript">
            function geocode() {
                PF('geoMap').geocode(document.getElementById('address').value);
            }
        </script>
 
        <h:form prependId="false">
            <h:panelGrid columns="3" style="margin-bottom:10px" cellpadding="5">
                <p:outputLabel for="address" value="Bulmak İstediğiniz Yeri Yazınız:" />
                <p:inputText id="address" />
                <p:commandButton value="Ara" icon="ui-icon-search" onclick="geocode()" type="button" />
            </h:panelGrid>

            <p:gmap id="geoGmap" widgetVar="geoMap" center="#{markerBean.centerGeoMap}" zoom="2" type="ROADMAP" model="#{markerBean.geoModel}" style="width:100%;height:400px">
                <p:ajax event="geocode" listener="#{markerBean.onGeocode}" update="@this" />
            </p:gmap>
        </h:form>
    </h:body>
</html>

<?xml version='1.0' encoding='UTF-8' ?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"

xmlns:h="http://xmlns.jcp.org/jsf/html"

xmlns:p="http://primefaces.org/ui">

<h:head>

<title>GMap Kullanımı</title>

</h:head>

<h:body>

function geocode() {

PF('geoMap').geocode(document.getElementById('address').value);

}

</script>

<h:form prependId="false">

<h:panelGrid columns="3" style="margin-bottom:10px" cellpadding="5">

<p:outputLabel for="address" value="Bulmak İstediğiniz Yeri Yazınız:" />

<p:inputText id="address" />

<p:commandButton value="Ara" icon="ui-icon-search" onclick="geocode()" type="button" />

</h:panelGrid>

<p:gmap id="geoGmap" widgetVar="geoMap" center="#{markerBean.centerGeoMap}" zoom="2" type="ROADMAP" model="#{markerBean.geoModel}" style="width:100%;height:400px">

<p:ajax event="geocode" listener="#{markerBean.onGeocode}" update="@this" />

</p:gmap>

</h:form>

</h:body>

</html>

Xhtml içinde head etiketleri arasında gördüğünüz Script ile girilen adresin aranması işlemi yapılıyor. Form içinde panelGrid ile aranacak yeri alıyoruz ve aratıyoruz.

GMap tarafında koordinasyon atanması ve model kullanımı işlemi Java sınıfı vasıtası ile yapılıyor.

package gmap;

import java.io.Serializable;
import java.util.List;
import javax.annotation.PostConstruct;
import javax.faces.bean.ManagedBean;
import org.primefaces.event.map.GeocodeEvent;
 
import org.primefaces.model.map.DefaultMapModel;
import org.primefaces.model.map.GeocodeResult;
import org.primefaces.model.map.LatLng;
import org.primefaces.model.map.MapModel;
import org.primefaces.model.map.Marker;
 
@ManagedBean
public class MarkerBean implements Serializable {
    
    private MapModel geoModel;
    private String centerGeoMap = "41.850033, -87.6500523";
     
    @PostConstruct
    public void init() {
        geoModel = new DefaultMapModel();
    }
     
    public void onGeocode(GeocodeEvent event) {
        List<GeocodeResult> results = event.getResults();
         
        if (results != null && !results.isEmpty()) {
            LatLng center = results.get(0).getLatLng();
            centerGeoMap = center.getLat() + "," + center.getLng();
             
            for (int i = 0; i < results.size(); i++) {
                GeocodeResult result = results.get(i);
                geoModel.addOverlay(new Marker(result.getLatLng(), result.getAddress()));
            }
        }
    }
 
    public MapModel getGeoModel() {
        return geoModel;
    }
 
    public String getCenterGeoMap() {
        return centerGeoMap;
    }
}

package gmap;

import java.io.Serializable;

import java.util.List;

import javax.annotation.PostConstruct;

import javax.faces.bean.ManagedBean;

import org.primefaces.event.map.GeocodeEvent;

import org.primefaces.model.map.DefaultMapModel;

import org.primefaces.model.map.GeocodeResult;

import org.primefaces.model.map.LatLng;

import org.primefaces.model.map.MapModel;

import org.primefaces.model.map.Marker;

@ManagedBean

public class MarkerBean implements Serializable {

private MapModel geoModel;

private String centerGeoMap = "41.850033, -87.6500523";

@PostConstruct

public void init() {

geoModel = new DefaultMapModel();

}

public void onGeocode(GeocodeEvent event) {

List<GeocodeResult> results = event.getResults();

if (results != null && !results.isEmpty()) {

LatLng center = results.get(0).getLatLng();

centerGeoMap = center.getLat() + "," + center.getLng();

for (int i = 0; i < results.size(); i++) {

GeocodeResult result = results.get(i);

geoModel.addOverlay(new Marker(result.getLatLng(), result.getAddress()));

}

public MapModel getGeoModel() {

return geoModel;

}

public String getCenterGeoMap() {

return centerGeoMap;

}

Java sınıfımız içinde az önceki örneğe benzer şekilde bir MapModel nesnesi tanımlıyoruz. Default olarak koordinatları centerGeoMap ile veriyoruz ancak bu sayfa içinde Marker için geçerli olmayacak. Init metodu içinde MapModel nesnesi oluşturuluyor.

onGeocode metodu içinde xhtml içinden ajax ile tetiklenince gelen event’dan arama sonucu alıyoruz. Daha sonra aldığımız bu sonuç içerisinden koordinasyon bilgilerini alıp centerGeoMap nesnesine koyuyoruz. Bu nesne ekrandaki koordinasyon yönelimini yapacak. Akabinde bir döngü içinde ( muhtemelen tek sefer ) MapModel nesnemizin addOverlay metoduna bir Marker nesnesi veriyoruz. Marker oluşturma sırasında önceki örneğe benzer şekilde koordinasyon bilgilerini de veriyoruz.

Arama kutusuna Taksim yazıp Ara butonuna tıkladığımda Taksim’i bulup gösteriyor.

Bu yazıda da bu kadar arkadaşlar. OrderList ve GMap bileşenlerinin kullanımını öğrenmiş olduk. GMap bileşeni burada anlattığımın dışında 12 kullanım şekline daha sahip. http://www.primefaces.org/showcase/ui/data/gmap/basic.xhtml adresinden o kullanım şekillerine de bakabilirsiniz.

Başka bir yazıda görüşmek üzere sağlıcakla kalın arkadaşlar.

admin

Benzer Yazılar