Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
自分Mapray、もう試した? 使わへんと絶対損やで!知らんけどな
Search
T.Suda
July 05, 2025
Technology
230
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
自分Mapray、もう試した? 使わへんと絶対損やで! 知らんけどな
T.Suda
July 05, 2025
More Decks by T.Suda
See All by T.Suda
GISエンジニアよ 現場に行け!
sudataka
1
1.1k
君も受託系GISエンジニアにならないか
sudataka
4
1.1k
ストアが紡ぐ地図アプリケーション
sudataka
1
240
Other Decks in Technology
See All in Technology
ChatworkとBPaaS 異なる特性で学んだAI機能開発の ベストプラクティス
kubell_hr
2
2.7k
Sony_KMP_Journey_KotlinConf2026
sony
2
210
OCI Oracle AI Database Services新機能アップデート(2026/03-2026/05)
oracle4engineer
PRO
0
220
AI Engineering Summit Tokyo 2026 AIの前に、やることがある 〜医療データ企業の4フェーズ〜
dtaniwaki
0
1.8k
2026.06.13_AI時代に事業会社が「SIer出身エンジニア」を求める理由 / Why Businesses Seek Engineers with a System Integrator Background in the AI Era
jumtech
0
510
Amazon Bedrock AgentCore ワークショップ JAWS UG TOHOKU / amazon-bedrock-agentcore-workshop-jawsug-tohoku-2026
gawa
8
270
AIプラットフォームを運用し続けるための可観測性
tanimuyk
4
1.1k
BigQuery の Cross-cloud Lakehouse への歩み
phaya72
2
550
Platform Engineering as a Product: Criteria for Improvement and Multi-Tenant Design
kumorn5s
0
500
「嘘をつくテスト」の失敗例から学ぶ 良いテストコード #frontend_phpcon_do
asumikam
0
470
「気づいたら仕事が終わっている」バクラクAIエージェント本番運用の裏側 / layerx-bakuraku-aie2026
yuya4
18
10k
Oracle Cloud Infrastructure IaaS 新機能アップデート 2026/3 - 2026/5
oracle4engineer
PRO
1
190
Featured
See All Featured
Navigating the Design Leadership Dip - Product Design Week Design Leaders+ Conference 2024
apolaine
1
340
The browser strikes back
jonoalderson
0
1.1k
世界の人気アプリ100個を分析して見えたペイウォール設計の心得
akihiro_kokubo
PRO
71
40k
How to Grow Your eCommerce with AI & Automation
katarinadahlin
PRO
1
200
The Hidden Cost of Media on the Web [PixelPalooza 2025]
tammyeverts
2
320
Ruling the World: When Life Gets Gamed
codingconduct
0
250
What Being in a Rock Band Can Teach Us About Real World SEO
427marketing
0
250
Are puppies a ranking factor?
jonoalderson
1
3.5k
Context Engineering - Making Every Token Count
addyosmani
9
940
svc-hook: hooking system calls on ARM64 by binary rewriting
retrage
2
290
Between Models and Reality
mayunak
4
330
SEOcharity - Dark patterns in SEO and UX: How to avoid them and build a more ethical web
sarafernandez
0
200
Transcript
FOSS4G 2025 KANSAI 自分Mapray、もう試した? 使わへんと絶対損やで! 知らんけどな MIERUNE inc. 須田 ソニーグループ
松本 FOSS4G 2025 KANSAI
FOSS4G 2025 KANSAI FOSS4G 2025 KANSAI 自己紹介 MIERUNE inc. Senior
Software Engineer / Frontend 須田 峻宗 / Takamune Suda FOSS4G 2025 KANSAI 先月新疆ウイグル自治区に行ってきました! 松本さんの紹介は 別スライドにて⇨
FOSS4G 2025 KANSAI FOSS4G 2025 KANSAI Mapray とは ソニーグループ が提供するデジタルツインの開発者向けプラットフォーム
Mapray Cloud mapray JS 3D地理空間データの可視化を提供する オープンソースJavaScriptライブラリ mapray JS用に最適化された 2/3次元データ配信・変換パイプライン GitHub エンジンとUIを提供 地形・2/3Dデータ・点群・3Dモデル ラスター/ベクトルタイル データカタログ
FOSS4G 2025 KANSAI FOSS4G 2025 KANSAI サマリ 1. GISエンジニア触ってみた(うっすらとした)感想 2.
ソニー開発者による技術的な説明・デモ 3. Maprayへの期待 4. 今後の展開
FOSS4G 2025 KANSAI FOSS4G 2025 KANSAI Mapray × Svelteで触ってみた Maprayの公式ドキュメント『mapray
DOCS』を見ると どのような構造・技術・ロジックが使用されているのか知ることができる。 また、APIドキュメントも整理されているので、 分かりやすい & 最近だとAIエージェントにinputさせることも容易にできる。 1. Mapray Cloudのトークン発行 2. (Svelte PJ作成) 3. npm「@mapray/mapray-js」「@mapray/ui」インポート 4. StandardUIViewerをベースに組んでいった mapray JS: ver.0.9.6 Svelte: ver.5.34.9
FOSS4G 2025 KANSAI FOSS4G 2025 KANSAI デモ ちょっと タッチ処理の 判定が雑ですが…
FOSS4G 2025 KANSAI FOSS4G 2025 KANSAI
FOSS4G 2025 KANSAI FOSS4G 2025 KANSAI Mapray × Svelteで触ってみた StandardUIViewer(UI)
Viewer(コア) 開発者/ユーザー 操作 データ追加 etc... Mapray Cloud 外部データ 地形 点群/モデル レイヤーデータ コアエンジン「mapray」は機能が多くフルスクラッチでの実装となるので、 とりあえずはラッパーの「maprayui」を元に拡張させるのがオススメ Qiita『Svelteでmapray JSの環境を作る』
FOSS4G 2025 KANSAI FOSS4G 2025 KANSAI Mapray × Svelteで触ってみた感想 『レンダリング負荷がカメラ操作に影響しない』
描画(GPU) レンダリング処理スタック (頂点処理・ライスタライズ・シェーダー) 操作(CPU) ユーザー 操作 入力 データ取得•管理 カメラ操作 アプリ ロジック 3Dゲームエンジンの思想に基づき「描画処理」と「ユーザー操作」が分離されているため、 GPUに高い負荷がかかる状況下でも快適な操作性を実現している。
FOSS4G 2025 KANSAI FOSS4G 2025 KANSAI Mapray × Svelteで触ってみた感想 『詳細な地形が読み込まれた時に滑らかに変化する』
Cesiumでは地形モデルに量子メッシュ『Quantized Mesh』が採用されている。 『 』 Cesium Terrain Quantization Cesium『Terrain Quantization』 →量子化された特徴点を繋いだ三角形で表現されるので、 高い圧縮率を実現している。 一方で、細かいLODが読み込まれた時にカクカクしてる 見た目となってしまう。 Maprayでは地形モデルにラスター形式DEMが採用されている。 →特徴点が多くバイナリとはいえCesiumと比較するとデータ 容量は大きい。 豊富な特徴点により地形のレンダリング、特にズームイン時の 滑らかな描画を実現している。
FOSS4G 2025 KANSAI FOSS4G 2025 KANSAI Mapray × Svelteで触ってみた感想 『他にも』
- 静的アセットがないので - 導入がとても楽 - SSG->SSRへの転換もすごく容易 - バンドルサイズが小さくビルド時間が短縮され - Mapray Cloudのデータ変換パイプラインが優秀 - 変換めっちゃ早い - MVTにも対応している(する!) - MVT・3Dモデル(3D Tilesなど)両方に対応できるのは実務上非常にありがたい。 DBをほぼ同期的でCRUDできる。かつ最小単位でREADできる。
FOSS4G 2025 KANSAI FOSS4G 2025 KANSAI Mapray × Svelteで触ってみた感想 『レイヤー単位で扱えるデータが限られている』
現状でレイヤーとして扱えるのは「画像タイル」「等高線」のみ 一方で、GeoJSONなどベクトルデータをレイヤーとして扱うことはできず、 単一のEntityとして扱うこととなる。 そのため表示状態の制御や配色の更新などの処理については、 Entity1つ1つを更新させる必要がある。 当然ラッパーを作ればいいのだが、WebGISの活用方法として公式サポートしてくれると とても嬉しい!!! ただユーザーがシェーダーを使わなくても 等高線描画できるのは凄いよね
FOSS4G 2025 KANSAI FOSS4G 2025 KANSAI ただシェーダーを使わなくても 等高線描画できるのは良いよね Mapray ×
Svelteで触ってみた感想 『レイヤー単位で扱えるデータが限られている』おまけ 粗い解像度のタイルが使われる状況でも 十分な特徴量を保持しているため リアルな等高線が維持される。
FOSS4G 2025 KANSAI FOSS4G 2025 KANSAI 『(現時点で)開発者と日本語で時差なく話せる!』 (3Dオブジェクトなどを)地下から見上げる機能は ないんですか? 今はないです。
RenderStageの導入によりレンダリングと操作側の 負荷が分散することで、操作がスムーズに… 3Dグラフィックスのレンダリングは、GPUをフル活用する ためにGPUに対して命令をスタックするように描画を行う のが一般的で、レンダリングパイプラインと呼んだり… Mapray × Svelteで触ってみた感想
FOSS4G 2025 KANSAI FOSS4G 2025 KANSAI 『(現時点で)開発者と日本語で時差なく話せる!』 いっぱい質問・要望出します!! 今後ともよろしくお願いします!!! Mapray
× Svelteで触ってみた感想
FOSS4G 2025 KANSAI FOSS4G 2025 KANSAI 今後の展開 個人的には”OSS”としての展開が気になっています。 現状ではMapray Cloudの利用が前提となっていますが、
企業向け/効率的な描画・データ配信としてのMapray Cloudの収益により、OSSとしての mapray JSの開発・運営が持続される構造は現代的な「持続可能なOSS」として私は評価 しています。 たとえばDockerやGitLab、GIS分野においてはFeltやMapboxなど。 ただ、 個人利用や動的なデータインポート/変換パイプラインの観点で、 オープンな標準規格の採用を進めていただけることを期待しています。 また案件導入に向けた実際のユースケース & ロマンにのっとった機能開発において、 (OSSですし)共にパワーアップ していけたらと考えています! みなさんとも 意見交換したいです!
FOSS4G 2025 KANSAI FOSS4G 2025 KANSAI 今後の展開 今後もFOSS4Gでは引き続き Maprayの進化・案件導入の状況/結果 などについて共有していけたらと考えています!