それでは、鎌田さんよろしくお願いいたします今、紹介いただきました鎌田です今日は、先ほど紹介していただいたGISオンマンドプレスというタイトルでお話しさせていただこうと思いますこのスライドもURLなんですけどもこちらにURLコードとかありますURLもありますちょうどシェアとされるかなと思いますお話しさせていただきたいと思います今日のトピックはGISというものです皆さん、GISという言葉を聞いたことを聞きますGISなんですけどもジオグラミックインフォメーションシステム地理情報システムみたいなことに約されることが多いですがそれぞれの動画を紹介していただきます地理情報を管理したり価値化したりさまざまな数値的な分析を進行したりするシステムのことをGISというふうによく読んだりしますゆめのGISのゾルトはQGISとかアップGISというものはありますQGISはオープンソースプロジェクトで開発が進められているものですアップGISはプロプラエータリーS29会社があっているGISになりますこれらは僕がインストール型のGISMacとかWindowsにインストールしていろんな地理情報を扱ったりするような症状であります何か意見を復活そうながっくり言ってしまうと一情報を扱うようなソリューションというのがですねそれを一緒にGISなのかなというふうに私は思っていますこのセッションのオートピックなんですけどもオープンソースのライブラリーそれらを使ってブレッシングブラックホームであるワードプレスでですね一情報を手軽に扱ってみようそれをジョブアップフィッシングという名前をつけてみましたそういった話になります最初に地図の話を読むとしてから具体的にどういうふうにワードプレスとインテグレッションをしていくのがみたいなことですねごくごく基本的な部分なんですけども話しようかなと思っていますということで自分を紹介なんですが私の前をかまったと言います島県の前原市ですビアコン北の方におりますワードプレスと私の関わりなんですがミートアップの関西の中で市が勉強会に的な感じでやってますまだ2回しかやっていないんですけどもこれから何かというか定期的にやっていこうと思ってますので是非お近くの方一応言い方でベルカットなんで来ていただけるトーブレッシングですそれからダロス会という会社でワードプレス関連のことをインフラとかあるいはアプリ総合もアプリ総合もされたりしますけどもしておりますそれからワードプレスのマーティットプレス区の位置ということにも関わっていますテーブルとかプラグインの皆さんが販売して混ぜたいとしていただいたりするようなプラグオンになりますそれから地理情報と私の関わりなんですが私の前職は関係省をお見せしましておりました国立公園というのは自然景観が保護されたクイーンなんですけどもそういったところを市場の管理とかあるいは地上野生生物が何かは当然な関係の地上野生物をしておりました特に市場の管理とても大事なものなので地理情報のオペレーション先ほど紹介したアフリーとかを触ったりしておりましたあとは主人公ですねあとドローズにあった川賀市から地図読売にするのはお知らしみがある感じですそれから他の地図関係なんですけどもリズメ関大学で非常勤効志をしています新規教育とかWeb技術を活用したコチズ研究何回かに携わっています例えばですねこれはリズメ関大学のコチズコレクションなんですけども京都の古い地図とか集められていたりしまして特にちょっと触ってるのがこのマップワーカーというアプリなんですけどもこれはですね地図の上にコチズを重ねてそれから井戸経路をですね合わせることで投下してみて古い地図と今後で土地利用がどう変わったかとかそういったことをですね研究するための基盤みたいなものをですね作りしておりますそれからこちらのメインで今挟まっているものになります株式会社ジョロニアというところでのジョロニアの開発者をしております地図に関するサービス開発ですねを取っておりますウェブサイトとかアプリにですね踏め込んで使うことを想定した地図専用のコストのサービスを取っておりますアプリと連携するようなウェブGIS機能その地図の地理情報ですね上手に扱うサービスだとかそれから地図そのものを提供したりしておりますこの4人のということでですねちょっと最初にウェブ地図の話をしたいと思いますウェブ地図とそれからタイルというのが後で出てくるんですけどもそれについてお話しようと思いますウェブで地図を配信するということなんですけども皆さんよくGoogleマップとかお使いになると思いますが地図を配信するにわかったらですねそれは膨大な量のデータとの戦いになりますいいかいなとトラミックをどうさばくかというかトラミックを押さえるかとかそういうとピンクの話になってきます例えばオープンストリートマップオープンストリートマップってご存知知ってるオープンストリートマップ楽しもうちょっと出てくるんですけどもコミュニティでみんなで作っている地図なんですねライセンスの機械しっかりしていただければ誰でも使える自由な地図になりますコミュニティベースですね地図が作られているというそういう一種のコミュニティなんですけどもそこの地図レキストビッグリプラネットという何かリンクがついてますけどこれはですね地球全部のデータが圧縮された状態でこれいつ取ったのかなたぶん1週間か2週間前くらい作り一生取ったんですけどもその時点でですね48GBデータがあるというものすごい量のデータがあるかと思ったんですけどもそれをどう裁くかというのが地図を配信する上ですごい大事になってくると48GB一気に全部ダウンロードするわけにはいかないので皆さんはですねよくから地図を使うときには必要な分だけ必要な場所のデータを取得したりする必要があるわけですそれを支える技術がタイルと呼ばれるものになりますごくごく簡単に言うとタイルは分割された画像を配信する技術になりますタイル地図というものを地図をタイル上に分割してそれを配信するという技術になります企画も色々あるんですがよく使われているのはですね256ピクセルシフォーのラスタ画像MAPでもZPGでもPLGでもいいんですけどもそういったものを使うことが多いです例えばですねこれはZoom1ちょっとZoom1についてはまた後で説明しますけれどもZoom1という自分ではですね世界を4等分してですねそれぞれ256ピクセルの4枚の技術を分割するというようなことがあります手を触れちゃった地球全体をとさめた画像をZoom1をゼロとしてZoom1が1を増えることに体育を4等分するということを読みますつまりですねZoom1をゼロでは体育は1枚Zoom1を1では共同して4枚2では4の事情で16枚次が64枚そういう風にどんどん倍倍で分割していきますこの感じで画像をたくさん作ってそれを必要な部分だけ対戦するということをするわけですねZoom0で例えば世界中の道路を回避しまったりすると地図が真っ黒になってしまう地図として疲れなくなってしまうので体育を作るときは情報の取捨選択というのが大事なのかなという例えば地図がちょっとかき込みすぎかなと思ったら狭い道路については大きなスームだけで共有するようにして高速道路は収容な道路になるので小さい済みからちゃんと絵に描いておこうかなみたいな取捨選択がされて体育が作られるわけですZoom値がZoom値をZとったとき体育の数は2の2Z上になります例えばZoom18という値を取ったときこれはうめろの駅前のちょっとスクリーショットとった部分なんですけれどもそのときの体育の総数は全世界で171億枚ありますファイル数が171億ファイルこれだけでも凄い膨大なんですけれども実はZoom18だけではなくてもちろん0から0、1、2、3あるので大体の総数は2の0上達、2の2上達点点点点2の36上になるわけですこれどのくらいになるか計算すると全部の数と残しから916億ファイル存在することになりますさっきは何といいますか雑談的なお遊び的な考えの話なんですけれども例えば仮に内部1枚が1600万ショットのただのビットマップファイルビットマップ形式のファイルだったときなんですけれどもそのときのサイズが916をかける256をかける256をかける3倍となので10の16上0も16個つくわけなんですけどもこれ16ペタマイトになりますエダムレースのS3ストレージ東京理所に全部突っ込んだと発生すると月当たり411枚それだけ問題な量だと考えて見立てるという話になりますただBMP形式は手が過ぎるので適にJPEGとかPNGで記者さんが存在すると思うのでさすがにこんなサイズにはならないですねあと世界の7割は海なので海の画像基本的に単一書ってなんてかなりサイズもかかるかなって感じなので100分ですくらいにはなるんじゃないですかねちょっとちゃんと計算したことないですけどもこんな感じのデータ量になりますあとサーパーとか触ってる人の方にはこういうトピックがちょっと面白いかなと思って計算していたんですけどもS3の検討性11-999.99%9が11個ついてるんですけどもめっちゃ検討っていうイメージでデータが決してなわれないんじゃないのっていうイメージなんですけども他に916個のS3にここのしたときにWESのSLAの値を信じると値あたり約1個0.916個のタイルが失われるS3のその検討性でも全部のタイルを完全にこそんすることができないというような感じですそれだけ膨大な量になるという感じですねちなみにズーム18で終わりではなくて19 20どんどん増やしていけばさらに4倍4倍で増えていくのでこれ以上どんどんどのコストがかかっていくという感じになりますちょっと話を戻すとこのままズームのタイルだけを配信して地図を表示するということをしたいわけですね例えばズーム3で世界を64個かな64個ですね2分勝ちで例えば日本周辺の地図だけを表示したいという風になったりですねこの辺のいくつか若干数の対応を取ってきたらOKなのがわけですこうすることで世界全部の画像を取得しなくても地図表示それが対応で配信するという技術になります実際に具体的な対応もぜひぜひご覧になっていただきたいんですけどこれはですねオープンストリートマップの対応ですねちょっとデポストレーションをいただこうとしてきたになりますで対応の特定の仕方なんですけれどもズームの値それからX方向軽度軽度方向の番号Y方向イド方向の番号という感じになりますで例えばオープンストリートマップのときはこれらのタイル画像にはこんな感じのいわれるでアクセスできるようになってますこれかなり標準的なテンプレートですこんな感じで実際にサーバーにデータが保存されていたりあるいは動的に生成したりしてもいいんですけども画像が保存されているというのが性的なタイルをこれまでラスタータイルの話をしていたんですね画像ゲルジケーシーとかあるいはJPMでもいいんですけどもそういった感じで保存されているですよみたいな手で話していたんですけどもデザインされている方とかラスターということもあるとそれならペクソルタイルもあるんじゃないのペクソルタイルもあるんじゃないのという風に人もあると思うんですがあるんですねペクソルタイルもありますペクソルタイルは画像が入ってるわけではなくデモのドールのイドケードとかあるいは輪郭船そういったものを機械反応が可能な状態で確認しているものになりますベクトル形式そういうデータ形式もありますそういう情報をみんなタイルの中に持っているのでフロントエンド側の技術で地図の見た目は自由にこうすることができるんですね例えば例えばならばCSSを描くようなCSSを描くような感じで地図の見た目を変更することができるわけです例えば建物の立体データとかがベクソルタイルに入っていれば3Dでの表示とか具体的にはですね特徴としてはラサタイルと比べて軽くなることが多いです一側には言えないんですけどもなのでマトラフィックより抑えられることがベクソルタイルを使う意味と意味になります実際にこんな感じで左の方は建物の立体表示しているもので右の方はそれを抑えている感じになりますこういう風にこれは同じタイムのデータを使っているんですけどもフロント側でちょっとジャバスクリップを描いてあげたらこういう風に地図の見た目を成形したりすることができるわけですということでここから先は地図を地図タイルを表示する具体的な方法についてお話ししていこうと思います地図の地図を表示する簡単な方法なんですけどもいろんなライブラリがあるんですけれども手順としてはほとんど一緒ですライブラリのスクリプトを読み込んでそれからどの地図タイルを使うのかというのを意味われるを使って指定します最後にジャバスクリプトとかで地図の読み込み方を指定するかというのを指定するだけで地図を表示することができますまずライブラリについて地図を表示するジャバスクリプトのライブラリにいっぱいありまして有名なのはリブレットとかNPMとかで簡単にイストールできます板本も公開されているのでダウンロードして使っていただいたりすることもできるでしょうそれからBoxGLJSというのがありますこれはベクトルタイルに対応したライブラリになりますそれからフェイトで作っているジロニアのエンデッドAPIというのがありますねそれからBoxGLJSのアンパーでより便利に表示されするような機能を入れていますそれからライブラリの次はどの地図を表示するかという話になると思うんですが例えばコクトチリンのチリンタイルというのがあります電子コクト基本図とか他にもいろんな種類のタイルをコクトチリンが用意していますここにカイトのサイトを見てもらうとURLという形でこのタイルのURLのエンドコインを公開してくれていますこれすごく簡単な手続き踏めば疲れるものになります現にチリン地図を使ってガーマッシュアップしたアプリとかが上でたくさん見ることができますそれから選択肢としてはオープンストリートマップのタイルというのもありますねオープンストリートマップも同じフォーマットで配信されているラストタイルなのでリフレットとかマップオフスジェルJSで読み込んだりすることができますただこちらで注意していただきたいのがオープンストリートマップの代理の利用規約のあるですねそこに書いてあるのがここでの下で引用している分なんですけれどもオープンストリートマップのデータは誰でも自由に使います我々の代理サーバーは違いますといっているわけですこれ何かというとデータそのものは自由なアイセンスがついているものなんですけれどもそのデータをコストしている代理サーバーは彼らがまさまなまな方法でスポンサーバーを得たりして運用しているものを実際にコストの負担というものなのでそれを乱用したらダメですよというようなことがされていると言われております所要利用したりですねあるいはガーッとすべての代理をクロールしてダウンロしてくるとかそういったヘビーユースはやめてねというふうに言ってありますなのでオープンストリートマットの代理を使うときは処定の方法でダウンロードしてセルフホスト自分でホストしたりとかあるいは他の代替の代理ホストキングサービスサーバースト結構あるんですね商用のサービスがあるのでそういったものを利用する必要がありますそれから別の選択肢としては弊社ジオロニアの代理なんかも分かりますポクスGLJSとかあとは弊社の選挙のエピアとかで読み込むことができる代理を弊社ホストしておりますここからさっきワードプレスでどうやってインタグレーションをしていくかみたいな話をしようと思いますプラグインを2個概念実装というか例として紹介できるもの2つ用意してきました1つ目はポクスGLJSというライブラリを使ってベクトル対応を表示する方法を紹介しますプラグインとして実装しますここに見たことが言われるのですけどアップロードしてあるのでもし興味がなかったらご覧くださいまずポクスGLJSなんですけれどもこれはポクスという会社が作っているオープンソースのベクトル対応を表示するための実装ライブラリになりますいろんな機能があるんですこれのロード方法なんですけども永久するだけワードプレスのスクリプトとして永久するだけですもうちょっと補着してCDNを使う前提としてコードを描いていきましたけれどももちろんオジシンベルNPMとか使ってダウンロードしてもらって大丈夫ですスクリプトとそれから見た目の表示に見た目の整えるために必要なCSSを永久して挙げるだけですポクスのスクリプトスタイル永久した後は後は地図を表示するスクリプトをポンっておいてあげたらポンってきますマップコックスGLドットマップっていうクラスがいますのでこれを例えばマップっていうIDの要素に対してこれまでこういうスタイルで表示するっていうのを一業一業とか一捨て止めてですかねメソと呼んであるメソと呼んであるメソと呼んであるコンストラクターを呼んであげるだけになります地図の見た目を制御するスタイルJSONっていうのがあってこれが例えるならCSSみたいなもんですこれはポクスGLJSのドキュメットに色々記載の方法が技術の方法が書いたり興味のある方コラボなっていただけたらと思うんですが例えばこの例ですとギター部にアップロードしてあるこういた見た目を解決するためのJSONを言われるを示して読み込むだけになりますこの辺ちょっと独特の規模があるんですけどそれさえ書いたら好きなように見た目を制御できるとそんな感じになります例えばこれですけどランドカバークレイシアってありますねこれは大陸表彰かな今日が今日の色とか見た目を定義している部分になりますねこういうのがアーッとあります今日のライセンスが大事なものをダウンロードしてきて自分でカスタマイズしたいかとかあるいは専用のエディターとかもあるのでそういうので作ったりすることが可能ですあとはこっちで地図を表示するスクリップを作ったんですけれどもそいつをアウトプレスに影響してあげればこれだ地図を表示できないですねこれを研究した上であとは最後にコンテンツを作った本件です今回はこのアイディーコールマップっていうアイディー持ってる要素に地図を描くよっていうスクリップを作ったんであとはコンテンツそしてアウトプレスに入行してあげたら地図が表示されるこんな感じで地図を終わったら史上に表示することができるという例にあとは今は流行るというかブロックデータでも地図を扱ったりすることができるんでその実装例なんかを紹介しようかなと思いますこっちの例ではBOX GLJSとご完成があるジョロニアのエンベット APIで使ってペクトルダイブを表示する方法をご紹介しようかなと思いますグテンベルグヤデータのブロックとして今回は質問しますここで何するかというと地図を揃うとしてかつインターネット上から地物及び込んで表示する方法について紹介しようと思いますまずジョロニアのエンベット APIなんですけどこちらはライセンスのMITかな公開されているHTMLだけの技術で地図を表示することができる独自のJavaScript APIでありますこの APIを実際にダウンロードしてもらってもいいですしあるいはフェーションのCDNとかから読み込んでいただくとHTMLのタップだけで地図を表示できるそういうタッグのJavaScript APIになりますそれからさっき出てきた地物という言葉について紹介しようと思います地物なんですけども地物これ結構GIS界隈で独特の言葉なんですが要は物地球上に存在するアリとアイル物の事を地物という風に用意いますGISの文学ではテン、ライン、コリモンこの3つを使うことが多いですテンはこの絵だとここに木があるみたいなテンデータこのイドケートに木があるみたいなテンデータラインには道路とか線路みたいな要は線路線路データ最後にコリモンというのは建物の敷地とか区域例えば田んぼのエリアとか農業関係の地域のエリアとかそういったものをエリアでコリモンという風に呼んだりすることがありますこういうものを地図に表示したいという重要が結構あるかと思うんですよね例えば不動産のサイトを作っている時何かにご自身の会社というかその不動産の会社さんがご自身で扱っていらっしゃる物件を地図上に見えて表示したいだとかあるいはそうですね医療生さんだとこういった区域の管理のことをしたいようなことがあるかと思いますそういう地物を表示する方向について説明しようと思います地物なんですけども実は両人的なデータ交換コマットがジオ・ジェイソンのってやつをよく使うのですねこれ名前の通りジェイソン形式のものになりますジオは地理というの説明ですけどもジオ・ジェイソンというものがありますコマットも決められたプロパッキーを持っているジェイソンというだけになりますプロパッキーというのがあってその中に好きなようにディバリューであたりを入れられたりして例えばタイトルが押さかるコンクタイムのキャンバスでデスクリプションみたいなものも提起したりすることができますそれからジオ・メトリーというフィールドを持っててここにタイムポイントこれは点ベータですよみたいな情報を与えてコーデネットコーデネット座標が計136.144リード35.423みたいな部分与えると点ベータを表現したりすることができます今回はそのウェブの地図マシャックみたいな感じでギターを上で押すとしてジオ・ジェイソンを直接読み込んだりするような例をご紹介しようかなと思います例として私がよく伝えましているものにここではミワコンの島5個あるんですけどそれをジオ・ジェイソン形式にイッターボジョンにホストしたりしていますこれを読み込んでみようと思います今回はブロックを作るのでブロックをやらずに読もっているかザッとのがれも合わせで説明しようと思うんですけどもブロックではリアクトJSXコーブにってやつを使うのですよねブラザがネイティで呼べるジャバスクリプトじゃないのでそういったものにいろんなライブラリが必要になりますバベルというトランスパイアーこれはブテンベルブ関連のツールでも魔法の依存関係としていっぱい入っているものなんですけどもバベルのライブラリをちょっと使おうかなと思っていますバベルコアとバベルCAライブこの辺バベルを実行するためにツールを入れて最後にリアクトのJSXコーブを変換するバベルプラグイントランスコーブのリアクトJSXというライブラリがあるんですけどもNPMインストールでサックルとインストールしてあげてそれからバベルの設定としてバベルRCという設定ファイルがあるのでそこにこのプラグインを使おうという感じでプラグインズバベルトランスコーブリアクトJSXに書いてあげるとJSXで書いたジャバスクリプトをブラザが呼べる形のジャバスクリプトに変換してくれるということができますこの感じで豪国シンプルに開発環境を作ったりしますでそれから今度はBHPですねジオロニアのエンベットAPIを今回使ってドッジと表示するのでそれとそれからのブロックを定義するスクリプトをロードする部分をちょっと書いて置いてあげます研究スクリプトですねそのブロックのジャバスクリプトを読み込んでそれからですねあとちょっとどこに好きなように入れてもらったらいいと思うんですけどとりあえずWPフッターでジオロニアのスクリプトをお尻の方に入れたりしましたでこの感じで必要なスクリプトを読み込むようにしつつブロックエディタのブロックエディタのブロックを定義するスクリプトなんかも書いてあげますブロックを定義するレスタープロックタイプという関数がですねwindow.wp.blogsに入ってますのでそこをですねドキュメントをしたがってですね名前とかも決めてあげて定義してあげますでこの中にですねアトリブーツというプロマティがあるんですけどもこれはですねあのその何て言いますか値を扱うためのですねあのプロマティですね今回はですねその地図のスタイルとそれからジオデイそのURLをですね保存したいのでその2つをですねストリングの文字列型として最初に定義して置いてあげますそれからブロックエリーターの規模になるのがエディットとセーブという2つのコーデントになりますこいつをですねこの次に定義しますでブロックエリーターのセーブとエリットに関する私の理解なんですけどもあのあのブロックエリーターでですね色々表示したりするためにはまずアドミンのインターフェースが入りますよねそれからですねそのアドミンで書いた内容がどういうふうにHTMLとしてWebViewで出現するかというその2つになりますこれらをですね総合に変換してくれるのがセーブとエディット2つのコンポネントになりますでセーブで作ったHTMLはですねあの観客変換が可能でですねアドミンのほうのインターフェースで再度その入力画面をですね再現することができるとその感じの仕組みになってると私は理解しておりますでえーとさっき書いたあのちょっとスライドの順番がおかしくすみません先にこっち話しますえーとまあエディットのほうですねエディットはですねあのアドミンの画面で表示する部分ですえーと今回はですねえーとインプットを使ってスタイルと上限のURLをですねかけるごとするというゴーフゴーフ簡単なあのブロックにしたいのでインプットタグをですね書いてあげますインプットにですねあのえーとスタイルのURLを保存して表示することができるような感じのリアクトのJSXを書いてあげますそうするとこんな感じでですねあのスタイルにあるここに入れてねジョーゼスのURLをここに入れてねみたいな感じでですねブロックをレタリングできるわけですあのまあもっと怒った風にしたいんでしたらあのここに地図も表示したりとかですねいろいろ頑張るとできますでそれから今度はウェブビューのほうの表示ですねセーブした時にどういうHTMLでデータベースにその魅力なりを保存されるかというのを提供するところなんですけどもここに先ほどのジェロニアのエンベットAPIの独自記報で書いてあげるとですねあのその内容のフェブビューのほうに表示されるようになりますでこのエンベットAPIの記報なんですけどもこのHTMLだけでですね地図を表示できるというのが特徴的でえーとですねクラスにですねジェロニアというクラスをですね入れてあげるとですねエンベットAPIを表示するキーになってますでこのジェロニアというプラスがついた要素を探してあの勝手に地図を書くというのがエンベットAPIのクローになりますでその他にですねスタイルとしてスタイルJSONのURLを入れてあげるとそれからジョージェーソンとしてあのジョージェーソンのURLを入れてあげるようにするとですねそれぞれあの値が設定されるようになりますジョージェーソンというかキーがデータジョージェーソンデータスタイルですねデータ独自を最後にジョロニアのAPIキーをですねデータキーという感じで入れてあげると地図が表示されるようになりますでこんな感じでですねイシテメルが連なりにされて地図と地物が表示されるようになるわけですねでちょっと前後しますけどもえーとこんな感じでJSXでですね書いたあのリアクトのそのコンポーネットなんですけども書いた後にですねあのドットJSXというものをドットJSに変換してあげるとですねプラザで読めるようになるそういう仕組みになってますあのこのえーとJSXはこういう風にですねイシテメルジャバスクリップのマジってような感じであの弱いイシテメルのテンプレートを書くこういう風になりますこの感じでですねあのワードプレスでもですねその専用のですねプラグの2つの実装例を示してご紹介しましたということでですねあのえーとマービッジをパフェッシングということでですねあのぜひ皆さんもですねあの簡単にあの地図を使うことできますのでぜひ試してみてくださいはいということで以上ですこの時間にもいますのでぜひこれまでくださいありがとうございますもう一度拍手をお願い致しすっごいベッドタイルっていうのを使うとベッドタイルはいベッドタイルを使うとあのブルーマップとかアップルマップ回転させられるんじゃないですかはいあれはセクラファイルさせられると関係がないあえーと関係してますえーと例えばですねラスタタイルですとえーとラスタタイルですとこのこれはもうはいでもベッドタイルの時はこのラベルは文字データとして持っているので文字の適当データとして持っているのでこの回転に合わせて回転させないというか元の位置に殴った持たせるということが可能ですはいCDSのタグ付けCDSのプラス付けたら時間するとになっていると思うんですけどあれ流れとしては一回トグが連打されてその後JSでオーバーライドするえーとえーとですね流れとしては一瞬なんだろうからのディブタグが出てえーとですねえーと詳しく説明するとえーとそのえーとウェブの表示をブロックするものとして見えてない画面の画面の外側見えてない部分で実際表示されちゃうというのはちょっと嫌ですよねその余計にドラミンをかかりますしなので流れとしてはあのイタセクションオフザーバーやあの目外ですねウィンドドットインカーセクションオフザーバーっていうのがあってですねその要素が画面に入ったときに発火するゴールバックみたいなのを提供できるんですよそれを使ってあの地図が表示されるべき状態になったというのを検知したときにその要素があーごめんもう前に1ステップあります最初にこのゼロニアっていうクラスを持ってる要素を取得しておいてであの表示されるべき状態になったときにそのインタセクションオフザーバー表示される状態っていうのが検出できたときにあの地図を表示するという流れになりますイメージとしてはバトンマネージーロードみたいなあそうです入れてるってことですはいそうですただ仮に使うとしたらこのスタイルでタグついてるみたいな感じでなんかプレイスフォーダーというか場所だけ400でまあ灰色も入っていくので作っておくとUIとしてまああんまり違わかなく作れるかもしれないはいその取りですねはいはいこの方よろしいでしょうかすごいスポンです実はですねテクソルタイルの地図を表示させてみるとあのめちゃブームって言います他のすごいもありますフカはすごい高いはいウェブジールを使って連打してるんですけどもフェザリーがすごいあるっぽいですただ最近精度がすごい上がってきてるんでそれでベストルタイルでも使えるようになってきたというようなアイケンがありますそうですねどれだけ描くのかに教えたりなんですけどはいスマートフォンでも全然持ってますはいちゃんと押さえればだからよろしいでしょうかそれではこのもし質問等がございましたら高評価にそちらで回っていただけたらと思いますありがとうございましたありがとうございます