32

Geospatial web development with GeoEXT

Embed Size (px)

DESCRIPTION

Slides from the 4th UdG SIGTE Summer School

Citation preview

Page 1: Geospatial web development with GeoEXT
Page 2: Geospatial web development with GeoEXT

Developing withgeoext

Alberto Romeu - @alrocarJorge Sanz - @xurxosanz

Page 3: Geospatial web development with GeoEXT

What is GEOEXT?"a JavaScript toolkit for Rich Web Mapping

Applications"

Page 4: Geospatial web development with GeoEXT

Where in the stack?

Page 5: Geospatial web development with GeoEXT

Why geoext?

Page 6: Geospatial web development with GeoEXT

WHY GEOEXT?

1From web pages to WEB APPLICATIONS

Page 7: Geospatial web development with GeoEXT

WHY GEOEXT?

2RICH UI components

Page 8: Geospatial web development with GeoEXT

WHY GEOEXT?

3FREE - BSD License

Page 9: Geospatial web development with GeoEXT

WHY GEOEXT?

4EASY to create complex web mapping applications

Page 10: Geospatial web development with GeoEXT

the concept

Page 11: Geospatial web development with GeoEXT

THE CONCEPT

1ExtJS + OpenLayers

UI + MAP

Page 12: Geospatial web development with GeoEXT

THE CONCEPT

2WRAPS OpenLayers objects in Ext data components

Page 13: Geospatial web development with GeoEXT

THE CONCEPT

3CONFIGURATION over programming

Page 14: Geospatial web development with GeoEXT

THE CONCEPT

4Components REUSE

Page 15: Geospatial web development with GeoEXT

WHEN (who) TOUSE?

Page 16: Geospatial web development with GeoEXT

WHEN TO USE?

1web GIS applications

Page 17: Geospatial web development with GeoEXT

WHEN TO USE?

2RICH UI components ( DESKTOP style)

Page 18: Geospatial web development with GeoEXT

WHEN TO USE?

3Strong use of OGC services

Page 19: Geospatial web development with GeoEXT

WHO TO USE?

4BEGINNERS confused by HTML/CSS

Page 20: Geospatial web development with GeoEXT

an exampleCreating a map

Page 21: Geospatial web development with GeoEXT

Learning resources

Page 22: Geospatial web development with GeoEXT

LEARNING RESOURCES

1Learn by EXAMPLE

GeoExt examples

ExtJS examples

OpenLayers examples

Page 23: Geospatial web development with GeoEXT

LEARNING RESOURCES

2Browse the DOCUMENTATION

GeoExt documentation

Page 24: Geospatial web development with GeoEXT

LEARNING RESOURCES

3API reference

GeoExt API reference

ExtJS 3.4 API reference

OpenLayers API reference

Page 25: Geospatial web development with GeoEXT

LEARNING RESOURCES

4Join the COMMUNITY

GeoExt users list

GeoExt developers list

Page 26: Geospatial web development with GeoEXT

geoext labCreating a WMS Viewer

Page 27: Geospatial web development with GeoEXT

GEOEXT LAB

1The MAP Panel

Page 28: Geospatial web development with GeoEXT

GEOEXT LAB

2The LAYER tree

Page 29: Geospatial web development with GeoEXT

GEOEXT LAB

3The LEGEND panel

Page 30: Geospatial web development with GeoEXT

GEOEXT LAB

4STORES

Layer store WMSCapabilities storeWFSCapabilities store

Feature store

Page 31: Geospatial web development with GeoEXT

GEOEXT LAB

5... and MORE

Opacity slider, popup, printing, feature renderers, stylereader, toolbars, actions, ...