지도 데이터, 시각화

2024.10.01 - [JS,Node,React] - React, D3.js를 이용한 지도 시각화

 

React, D3.js를 이용한 지도 시각화

지도 시각화 방법네이버, 카카오, Mapbox 등 지도 데이터를 제공하는 api를 활용한다면?장점 - 지도를 그릴 필요 없고, 적은 코드로 시각화 기능을 구현할 수 있다.단점 - 기본 디자인을 바꾸기 어렵

cornpip.tistory.com

저번에 지도 데이터에 대해 약간 다루었다.

원하는 지도 데이터를 얻기 위한 mapshape 명령어를 더 살펴보자.

 

https://github.com/vuski/admdongkor

대한민국 행정동 GeoJson을 받고

 

https://mapshaper.org/

mapShaper 웹 콘솔에 명령어를 입력하며 원하는 지도 데이터를 만들 수 있다.

mapshaper

$ -help
Usage:  mapshaper -<command> [options] ...

I/O commands
-i               input one or more files
-o               output edited content

Editing commands
-affine          transform coordinates by shifting, scaling and rotating
-classify        assign colors or values using one of several methods
-clean           fixes geometry issues, such as polygon overlaps and gaps
-clip            use a polygon layer to clip another layer
-colorizer       define a function to convert data values to color classes
-dashlines       split lines into sections, with or without a gap
-dissolve        merge features within a layer
-dissolve2       merge adjacent polygons (repairs overlaps and gaps)
-divide          divide lines by polygons, copy polygon data to lines
-dots            fill polygons with dots of one or more colors
-drop            delete layer(s) or elements within the target layer(s)
-each            create/update/delete data fields using a JS expression
-erase           use a polygon layer to erase another layer
-explode         divide multi-part features into single-part features
-filter          delete features using a JS expression
-filter-fields   retain a subset of data fields
-filter-islands  remove small detached polygon rings (islands)
-filter-slivers  remove small polygon rings
-graticule       create a graticule layer
-grid            create a grid of square or hexagonal polygons
-include         import JS data and functions for use in JS expressions
-inlay           inscribe a polygon layer inside another polygon layer
-innerlines      convert polygons to polylines along shared edges
-join            join data records from a file or layer to a layer
-lines           convert a polygon or point layer to a polyline layer
-merge-layers    merge multiple layers into as few layers as possible
-mosaic          convert a polygon layer with overlaps into a flat mosaic
-point-grid      create a rectangular grid of points
-points          create a point layer from a different layer type
-polygons        convert polylines to polygons
-proj            project your data (using Proj.4)
-rectangle       create a rectangle from a bbox or target layer
-rectangles      create a rectangle for each feature in a layer
-rename-fields   rename data fields
-rename-layers   assign new names to layers
-simplify        simplify the geometry of polygon and polyline features
-snap            snap together nearby vertices
-sort            sort features using a JS expression
-split           split a layer into single-feature or multi-feature layers
-split-on-grid   split features into separate layers using a grid
-style           set SVG style properties using JS or literal values
-symbols         symbolize points as arrows, circles, stars, polygons, etc.
-target          set active layer (or layers)
-union           create a flat mosaic from two or more polygon layers
-uniq            delete features with the same id as a previous feature

Experimental commands (may give unexpected results)
-cluster         group polygons into compact clusters
-data-fill       fill in missing values in a polygon layer
-frame           create a rectangular map frame layer at a given display width
-fuzzy-join      join points to polygons, with data fill and fuzzy match
-require         require a Node module or ES module to use in JS expressions
-run             create commands on-the-fly and run them
-scalebar        add a simple scale bar to SVG output
-shape           create a polyline or polygon from coordinates
-subdivide       recursively split a layer using a JS expression

Control flow commands
-if              run the following commands if a condition is met
-elif            test an alternate condition; used after -if
-else            run commands if all preceding -if/-elif conditions are false
-endif           mark the end of an -if sequence
-stop            stop processing (skip remaining commands)

Informational commands
-calc            calculate statistics about the features in a layer
-colors          print list of color scheme names
-comment         add a comment to the sequence of commands
-encodings       print list of supported text encodings (for .dbf import)
-help, -h        print help; takes optional command name
-info            print information about data layers
-inspect         print information about a feature
-print           print a message to stdout
-projections     print list of supported projections
-quiet           inhibit console messages
-verbose         print verbose processing messages
-version, -v     print mapshaper version

Enter mapshaper -help <command> to view options for a single command

다양한 명령어가 있다. 몇 가지만 살펴보자.

 

-info

Console은 우측 상단에 있다.

-info는 .geojson에 대한 정보와 예시로 하나의 데이터 필드 키-값들을 보여준다.

필드는 properties 오브젝트 안의 key를 뜻 한다.

 

-filter

-filter : 필드 값들을 조건으로 검색할 수 있다.

3,554개의 features 중 426개가 남았다. 저 상태로 export 하면 필터링된 데이터에 대해 export 된다.

 

-filter ❘❘ 조건

조건식을 사용할 수 있다.

 

-dissolve

-dissolve : merge features within a layer, layer를 병합할 수 있다.

'-dissolve 속성'을 사용하면 속성을 기준으로 features가 병합되어 17개의 features만 남았다.

 

-cliip

'-clip : 지정한 경계 내에 있는 데이터만 남긴다.

 

-each

-each : create/update/delete data fields using a JS expression

새로운 필드를 추가하거나 기존 필드 값을 수정, 그 밖에도 다양하게 쓸 수 있는 듯하다.

 

맨 처음 찍어본 -help를 보면 다양한 명령어가 있다.

하나의 지도 데이터(geojson, shapeFile, topoJson 등등)로 제한적이라면 여러 파일을 join 하고 다룰 수 있다.

 

복잡한 명령어가 필요하거나, 웹 콘솔이 불편하면 node로 mapshaper를 설치하고 로컬에서 사용하자.