Changes between Version 2 and Version 3 of ZooWorkshop/FOSS4GJapan/BuildingWPSClientUsingOL


Ignore:
Timestamp:
Oct 15, 2010, 9:11:34 PM (9 years ago)
Author:
djay
Comment:

--

Legend:

Unmodified
Added
Removed
Modified
  • ZooWorkshop/FOSS4GJapan/BuildingWPSClientUsingOL

    v2 v3  
    11= Building a WPS client using !OpenLayers =
    22
    3 The next step of our workshop is to connect to the OGR Services we have created from an OpenLayers map. This will allow to apply single or multiple geometries processes on user-selected polygons  and to display the new generated geometries.
     3The next step of our workshop is to connect to the OGR Services we have created from an !OpenLayers map. This will allow to apply single or multiple geometries processes on user-selected polygons  and to display the new generated geometries.
    44
    55== Creating a simple map showing the dataset as WMS ==
    66
    7 OpenLayers is also included in OSGeoLive default distribution, so it is convenient to use it for our needs. Please open your text editor and write the following HTML snippet:
     7!OpenLayers is also included in OSGeoLive default distribution, so it is convenient to use it for our needs. Please open your text editor and write the following HTML snippet:
    88
    99{{{
     
    2525}}}
    2626
    27 The following JavaScript code must then be added in a <script></script> section within the <head> one. This will setup a map showing the United States data as WMS.
     27The following !JavaScript code must then be added in a {{{<script></script>}}}} section within the {{{<head>}}} one. This will setup a map showing the United States data as WMS.
    2828
    2929{{{
     
    5151}}}
    5252
    53 Once done, please save your HTML file as zoo-ogr.html in your workshop directory, then copy it in /var/www and visualize it with your favorite Web browser using this link : http://localhost/zoo-ogr.html. You should obtain a map centered on the USA with the WMS layer activated.
     53Once done, please save your HTML file as zoo-ogr.html in your workshop directory, then copy it in {{{/var/www}}} and visualize it with your favorite Web browser using this link : http://localhost/zoo-ogr.html. You should obtain a map centered on the USA with the WMS layer activated.
    5454
    5555== Fetching the data layer as WFS and adding selection controls ==
    5656
    57 Before accessing the displayed data via WFS, you first have to create new vector layers dedicated to host the several interactions we are going to create. Please add the following lines within the init() function, and do not forget to add the newly created layer in the map.addLayers method:
     57Before accessing the displayed data via WFS, you first have to create new vector layers dedicated to host the several interactions we are going to create. Please add the following lines within the {{{init()}}} function, and do not forget to add the newly created layer in the {{{map.addLayers}}} method:
    5858
    5959{{{
     
    7777}}}
    7878
    79 Then, you can now access tdata by creating new controls to select polygons, as the following. Please note that OpenLayers.Protocol.WFS.fromWMSLayer(layer) is used to access geometries and that several state of selection are declared and append to the control variable.
     79Then, you can now access tdata by creating new controls to select polygons, as the following. Please note that {{{OpenLayers.Protocol.WFS.fromWMSLayer(layer)}}} is used to access geometries and that several state of selection are declared and append to the control variable.
    8080
    8181{{{
     
    104104== Calling the single geometrie processes from JavaScript ==
    105105
    106 Now that everything is setup, we can go on and call our OGR ZOO services with JavaScript. Please add the following lines after the init() function, which will call the single geometry processes.
     106Now that everything is setup, we can go on and call our OGR ZOO services with !JavaScript. Please add the following lines after the {{{init()}}} function, which will call the single geometry processes.
    107107
    108108{{{
     
    164164Save your HTML file again. You should now be able to select a polygon and to launch a Buffer, ConvexHull, Boundary or Centroid on it by clicking one of the button. The result of the process should appear as GeoJSON layer on the map, in orange color.
    165165
    166 == Calling the multiples geometries processes from JavaScript ==
    167 
    168 Using the same technique, you can now write a function dedicated to the multiple geometries processes. Please add the following lines after the simpleProcessing() function, we will guide you during the exercise in section 5 on how to create such a function.
     166== Calling the multiples geometries processes from !JavaScript ==
     167
     168Using the same technique, you can now write a function dedicated to the multiple geometries processes. Please add the following lines after the {{{simpleProcessing()}}} function, we will guide you during the exercise in section 5 on how to create such a function.
    169169
    170170{{{
     
    222222Note that this time we didn't use the GET method to request the ZOO Kernel but a XML POST. We did that because if you use the GET method you will get error due to the HTTP GET method limitation based on the length of your request. Using JSON string representing the geometry will make your request longer.
    223223
    224 Once you get the functions to call your multiple geometries processes, you' must add some buttons to fire the request call. Here is the HTML code to add to your current zoo-ogr.html file :
     224Once you get the functions to call your multiple geometries processes, you' must add some buttons to fire the request call. Here is the HTML code to add to your current {{{zoo-ogr.html}}} file :
    225225
    226226{{{

Search

Context Navigation

ZOO Sponsors

http://www.zoo-project.org/trac/chrome/site/img/geolabs-logo.pnghttp://www.zoo-project.org/trac/chrome/site/img/neogeo-logo.png http://www.zoo-project.org/trac/chrome/site/img/apptech-logo.png http://www.zoo-project.org/trac/chrome/site/img/3liz-logo.png http://www.zoo-project.org/trac/chrome/site/img/gateway-logo.png

Become a sponsor !

Knowledge partners

http://www.zoo-project.org/trac/chrome/site/img/ocu-logo.png http://www.zoo-project.org/trac/chrome/site/img/gucas-logo.png http://www.zoo-project.org/trac/chrome/site/img/polimi-logo.png http://www.zoo-project.org/trac/chrome/site/img/fem-logo.png http://www.zoo-project.org/trac/chrome/site/img/supsi-logo.png http://www.zoo-project.org/trac/chrome/site/img/cumtb-logo.png

Become a knowledge partner

Related links

http://zoo-project.org/img/ogclogo.png http://zoo-project.org/img/osgeologo.png