Download free for 30 days
Sign in
Upload
Language (EN)
Support
Business
Mobile
Social Media
Marketing
Technology
Art & Photos
Career
Design
Education
Presentations & Public Speaking
Government & Nonprofit
Healthcare
Internet
Law
Leadership & Management
Automotive
Engineering
Software
Recruiting & HR
Retail
Sales
Services
Science
Small Business & Entrepreneurship
Food
Environment
Economy & Finance
Data & Analytics
Investor Relations
Sports
Spiritual
News & Politics
Travel
Self Improvement
Real Estate
Entertainment & Humor
Health & Medicine
Devices & Hardware
Lifestyle
Change Language
Language
English
Español
Português
Français
Deutsche
Cancel
Save
EN
TK
Uploaded by
Takahiro Kamada
8,566 views
JavaScript GIS ライブラリ turf.js 入門
turf.jsの簡単な説明です。 日本語の資料が少ないので作成してみました。
Software
◦
Read more
9
Save
Share
Embed
Embed presentation
Download
Downloaded 19 times
1
/ 17
2
/ 17
3
/ 17
4
/ 17
5
/ 17
Most read
6
/ 17
7
/ 17
8
/ 17
9
/ 17
10
/ 17
Most read
11
/ 17
12
/ 17
13
/ 17
14
/ 17
Most read
15
/ 17
16
/ 17
17
/ 17
More Related Content
PDF
テスト文字列に「うんこ」と入れるな
by
Kentaro Matsui
PDF
ドキュメントを作りたくなってしまう魔法のツール「Sphinx」
by
Yoshiki Shibukawa
PDF
心理的安全性の構造 デブサミ2019夏 structure of psychological safety
by
Tokoroten Nakayama
PDF
ソーシャルゲームのためのデータベース設計
by
Yoshinori Matsunobu
PPTX
今こそ知りたいSpring Batch(Spring Fest 2020講演資料)
by
NTT DATA Technology & Innovation
PDF
CEDEC 2018 最速のC#の書き方 - C#大統一理論へ向けて性能的課題を払拭する
by
Yoshifumi Kawai
PDF
【Unite Tokyo 2018】さては非同期だなオメー!async/await完全に理解しよう
by
Unity Technologies Japan K.K.
PDF
メルカリ・ソウゾウでは どうGoを活用しているのか?
by
Takuya Ueda
テスト文字列に「うんこ」と入れるな
by
Kentaro Matsui
ドキュメントを作りたくなってしまう魔法のツール「Sphinx」
by
Yoshiki Shibukawa
心理的安全性の構造 デブサミ2019夏 structure of psychological safety
by
Tokoroten Nakayama
ソーシャルゲームのためのデータベース設計
by
Yoshinori Matsunobu
今こそ知りたいSpring Batch(Spring Fest 2020講演資料)
by
NTT DATA Technology & Innovation
CEDEC 2018 最速のC#の書き方 - C#大統一理論へ向けて性能的課題を払拭する
by
Yoshifumi Kawai
【Unite Tokyo 2018】さては非同期だなオメー!async/await完全に理解しよう
by
Unity Technologies Japan K.K.
メルカリ・ソウゾウでは どうGoを活用しているのか?
by
Takuya Ueda
What's hot
PDF
「UXデザインとは」からはじめる「本流」のUXデザインはじめの一歩 | UXデザイン基礎セミナー 第1回
by
Yoshiki Hayama
PDF
新入社員のための大規模ゲーム開発入門 サーバサイド編
by
infinite_loop
PDF
Railsで作るBFFの功罪
by
Recruit Lifestyle Co., Ltd.
PPTX
ネットストーカー御用達OSINTツールBlackBirdを触ってみた.pptx
by
Shota Shinogi
PPTX
CEDEC2019 大規模モバイルゲーム運用におけるマスタデータ管理事例
by
sairoutine
PDF
目grep入門 +解説
by
murachue
PDF
ビッグデータ処理データベースの全体像と使い分け
by
Recruit Technologies
PDF
Springを何となく使ってる人が抑えるべきポイント
by
土岐 孝平
PDF
Riderはいいぞ!
by
UnityTechnologiesJapan002
PDF
中級グラフィックス入門~シャドウマッピング総まとめ~
by
ProjectAsura
PDF
Unityで始めるバージョン管理 Git LFS 入門編
by
NAKAOKU Takahiro
PDF
Leaflet.js超入門
by
Takahiro Kamada
PDF
Spring Bootをはじめる時にやるべき10のこと
by
心 谷本
PDF
Dockerからcontainerdへの移行
by
Kohei Tokunaga
PDF
ドメイン駆動設計サンプルコードの徹底解説
by
増田 亨
PDF
マイクロにしすぎた結果がこれだよ!
by
mosa siru
PPTX
30分で分かる!OSの作り方
by
uchan_nos
PDF
【Unity道場スペシャル 2017博多】TextMesh Pro を使いこなす
by
Unity Technologies Japan K.K.
PDF
Unityではじめるオープンワールド入門 アーティスト編
by
Unity Technologies Japan K.K.
PDF
イミュータブルデータモデル(入門編)
by
Yoshitaka Kawashima
「UXデザインとは」からはじめる「本流」のUXデザインはじめの一歩 | UXデザイン基礎セミナー 第1回
by
Yoshiki Hayama
新入社員のための大規模ゲーム開発入門 サーバサイド編
by
infinite_loop
Railsで作るBFFの功罪
by
Recruit Lifestyle Co., Ltd.
ネットストーカー御用達OSINTツールBlackBirdを触ってみた.pptx
by
Shota Shinogi
CEDEC2019 大規模モバイルゲーム運用におけるマスタデータ管理事例
by
sairoutine
目grep入門 +解説
by
murachue
ビッグデータ処理データベースの全体像と使い分け
by
Recruit Technologies
Springを何となく使ってる人が抑えるべきポイント
by
土岐 孝平
Riderはいいぞ!
by
UnityTechnologiesJapan002
中級グラフィックス入門~シャドウマッピング総まとめ~
by
ProjectAsura
Unityで始めるバージョン管理 Git LFS 入門編
by
NAKAOKU Takahiro
Leaflet.js超入門
by
Takahiro Kamada
Spring Bootをはじめる時にやるべき10のこと
by
心 谷本
Dockerからcontainerdへの移行
by
Kohei Tokunaga
ドメイン駆動設計サンプルコードの徹底解説
by
増田 亨
マイクロにしすぎた結果がこれだよ!
by
mosa siru
30分で分かる!OSの作り方
by
uchan_nos
【Unity道場スペシャル 2017博多】TextMesh Pro を使いこなす
by
Unity Technologies Japan K.K.
Unityではじめるオープンワールド入門 アーティスト編
by
Unity Technologies Japan K.K.
イミュータブルデータモデル(入門編)
by
Yoshitaka Kawashima
JavaScript GIS ライブラリ turf.js 入門
1.
JavaScript GIS ライブラリ turf.js
入門 都筑総研
2.
turf.jsとは • 軽量・高速・オープンなWeb地図用のGISライブラリ • 米国
MapBox社が開発・公開 • クライアント(Webブラウザ)、サーバ(Node.js等) 両方で実行可能 http://turfjs.org/static/docs/ ドキュメントサイト
3.
基本 • 取り扱うGISデータ・フォーマット • GeoJSON形式 •
取り扱う形状 • 点:point • 線:line • 面:polygon
4.
できる事:空間計測・関係 • 重心・中心点の算出 :Centroids
and centers • 集合・統計関数 :Aggregation & stastics functions • バッファ分析:Buffer analysis • TIN(不整三角形網):Triangulated irregular networks • クラスタリング:Data classification • 距離計算:Distance calculations (一部抜粋)
5.
できる事:空間編集処理 • 簡略化:Simplify features •
結合・併合:Union ・Merge • 凹・凸包処理 :Concave & convex hulls • 補間:Interpolation • 矩形・六角形 グリッド出力:Grids・Hexagonal binning • フィルタリング・選択:Filter / select by attribute (一部抜粋)
6.
導入方法 • Webに公開されたデータをリンクする <script src='//api.tiles.mapbox.com/mapbox.js/plugins/turf/ v1.4.0/turf.min.js'></script> そのまま貼り付け、ダウンロードして利用して下さい
7.
事例:2点間の距離 • 新宿駅と代々木駅の直線距離計算してみます 新宿 代々木 © OpenStreetMap
contributors
8.
処理内容 1. GeoJSON形式の地点(新宿・代々木)の作成 2. 距離計算単位の宣言 3.
距離計測関数による距離計算の実行 サンプルコード https://github.com/tkama/turf_sample/blob/gh-pages/turf.distance.html
9.
1.GeoJSONの作成 //新宿駅のGeoJSONデータ var point1 =
{ "type": "Feature", "properties": {}, "geometry": { "type": "Point", "coordinates": [139.70058739185333,35.68956144849349] } }; //代々木駅のGeoJSONデータ var point2 = { "type": "Feature", "properties": {}, "geometry": { "type": "Point", "coordinates": [139.7020572423935,35.683975674120234] } };
10.
2.距離計算単位の宣言 //単位を表現する文字列を変数に入力 var units =
"kilometers"; //can be degrees, radians, miles, or kilometers 選択可能な単位 • 度:degrees • ラジアン : radians • マイル : miles • キロメートル : kilometers
11.
3.距離計算の実行 //距離計算 turf.distance( 地点1,
地点2, 計算単位 ); var distance = turf.distance( point1 , point2 , units ); //実行結果 0.635336862243156 計算の結果 2駅間の直線距離は 約635m
12.
事例2:バッファの作成 • 新宿駅を起点に半径500mの範囲(バッファ)を作成 500m
13.
処理内容 1. GeoJSON形式の地点(新宿駅)の作成 2. 距離計算単位の宣言 3.
バッファ作成関数 turf.bufferによる空間演算 サンプルコード https://github.com/tkama/turf_sample/blob/gh-pages/turf.buffer.html
14.
1.GeoJSONの作成 //新宿駅のGeoJSONデータ var point1 =
{ "type": "Feature", "properties": {}, "geometry": { "type": "Point", "coordinates": [139.70058739185333,35.68956144849349] } };
15.
2.距離計算単位の宣言 //単位を表現する文字列を変数に入力 var units =
"meters"; 選択可能な単位 • 度:degrees • フィート : feet • マイル : miles • キロメートル : kilometers • メートル : metrs
16.
3.バッファの作成 //単位を表現する文字列を変数に入力 var buffered =
turf.buffer( point1 , 500 , units ); //地図に追加 L.geoJson(buffered).addTo(map); turf.buffer関数 • 第1引数:地物型 / 複合地物型(点、線、面、複合型) • 第2引数 : 数値型 半径 • 第3引数 : 文字列型 単位('miles', 'feet', 'kilometers', 'meters', or 'degrees') • 戻り値:地物型 / 複合地物型(面)
17.
表示結果 © OpenStreetMap contributors
Download