A Simple Way to Create a Web Infographic Map: For Public Data and - PowerPoint PPT Presentation

A Simple Way to Create a Web Infographic Map: For Public Data and Private Data MangoSystem Research Engineer | Hanjin Lee @jinifor

Who$Are$We?!

How$to$Get$the$$ Public$(Open)$Data?

NS$Center$ (National$Spatial$Information$Clearinghouse) https://nsic.go.kr 8

Open$Data$Portal http://data.go.kr 9

Seoul$Open$Data$Plaza http://data.seoul.go.kr 10

Seoul$Open$Data$Plaza http://data.seoul.go.kr Lat������|������Lon 11

Australia� Japan� (http://data.gov.au/) (http://data.go.jp/) United�Kingdom� United�States�of�America� (http://data.gov.uk/) (http://www.data.gov/)

PINOGIO$Features?

Open$Source$Stack • PostgreSQL�/�PostGIS� • GXT�Server�(GeoServer�WPS�Extension)� • OpenLayers3�/�Leaflet 14

#GXT

GXT$(Geoprocessing$Engine) Geometry Statistics Vector$Features Spatial$Statistics GXT$ Core Grid$Coverage Custom GeoTools GeoAPI JTS JAI 16

GXT$(Geoprocessing$Engine) Category Function • Area,�Buffer,�Centroid,�Distance,�ManhattanDistance,�Union Geometry • Overlay,�Proximity,�Calculation,�Network Vector • Surface,�Interpolation,�Density,�Distance,�Reclassification,� Raster Conversion GXT$ • Classification,�Basic�Statistics,�Pearson,�Regression Statistics Modules • Pattern(Moran’s�I,�G-Statistics,�Spatial�LQ,�Nearest�Neighbor)� • Distribution(Mean�Center,�Central�Feature,�Standard� Spatial$ Statistics Distance,�SDE)� • Cluster(k-means) • Extension�Data�Store� Custom • Web�KOPSS�algorithm�Support GXT�Online�Documentation� (http://gxt.mangosystem.com/) 17

GXT$(Geoprocessing$Engine) Category Function $ ' x $ o ! ! B n • Area,�Buffer,�Centroid,�Distance,�ManhattanDistance,�Union l Geometry o o o i t T a $ c g u i D d E u • Overlay,�Proximity,�Calculation,�Network Vector $ $ d T X n a G $ ' h c r • Surface,�Interpolation,�Density,�Distance,�Reclassification,� a http://www.mangosystem.com:8080/gxt_updates$ e Raster s uDig$Plugin$Update$URL:$$ e Conversion R $ r o f $ e GXT$ e • Classification,�Basic�Statistics,�Pearson,�Regression Statistics r F Modules • Pattern(Moran’s�I,�G-Statistics,�Spatial�LQ,�Nearest�Neighbor)� • Distribution(Mean�Center,�Central�Feature,�Standard� Spatial$ Statistics Distance,�SDE)� • Cluster(k-means) • Extension�Data�Store� Custom • Web�KOPSS�algorithm�Support GXT�Online�Documentation� (http://gxt.mangosystem.com/) 18

Service$Category JSON,�XML MAPS� REST� API LAYER� DATA JSP�/�Ajax 19

Service$Category MAPS� LAYER� DATA Base$ Map Zone$ Layer 20

Mango$BaseMap MAPS� Mango�BaseMap� LAYER� (TMS) Physical,�Gray,�Black…⋰ DATA Base$ Map Zone$ Layer 21

Zone(District)$Layer MAPS� LAYER� DATA Base$ Map Zone$ Layer 22

Zone(District)$Layer • 100km$ National�point�number • 10km$ • 1km$ • 100m$ • 10m MAPS� LAYER� DATA Base$ Map Zone$ Layer 23

0 1 #DATA

#DATA MAPS� • Support�Formats� LAYER� • Vector�Formats� • Raster�Formats� DATA • Transform�support 25

#LAYER The�First�World�Map�of�Korea�+�

#LAYER MAPS� LAYER� DATA 27

Spatial$Statistics + = Population$Cartogram$$ Sejong�Metropolitan�Autonomous�City,�South�Korea� (http://www.sejong.go.kr/stat.do) 28

Fishnet$/$Hexagon Hexagon�Features Australian�Land�Tenure�1993� (source�:�http://data.gov.au/dataset) Fishnet�Features 29

Map$Styling$Library 30

COLOR$BREWER$2.0 http://colorbrewer2.org 31

pinoStyler.js + + + + Spectrum�� Color�Brewer�2.0 Colorpicker 32

pinoStyler.js UN-GGIM-AP$VGI$Portal$ product�by�National�Geographic�Information�Institute� (http://www.ngii.go.kr) 33

Rainy�day Cloudy�day Sunny�day

S� t� a� c� k�� o� #MAPS f� H� a� n� d� s

MAPS$Template …⋰…⋰ 39

Settings Preview

MAPS$Contents 41

Thanks! @jinifor hjlee mangosystem.com