xxxxxxxxxx<html lang="jp"><head><link href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/monokai.min.css" rel="stylesheet"><script src="//cdnjs.cloudflare.com/ajax/libs/marked/0.3.2/marked.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/d3/4.3.0/d3.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script><style>body { padding: 10px;}</style></head><body> <script> if(!Function.heredoc) Function.prototype.heredoc = function(){ return this.toString().match(/(?:\/\*(?:[\s\S]*?)\*\/)/).pop().replace(/^\/\*/, "").replace(/\*\/$/, "");}var doc = (function () {/*## 概要geojsonファイルから、スタティックなバイナリベクトルタイルを生成する。## 必要なもの下記ツールをインストールしておく。+ [tippecanoe](https://github.com/mapbox/tippecanoe)+ [mb-util](https://github.com/mapbox/mbutil)## 作業フロー1. geojson -> mbtiles geojsonをmbtilesファイルに変換する ```sh $ tippecanoe -o hoge.mbtiles hoge.geojson ```2. mbtiles -> .pbf mbtilesファイルを静的なpdfファイルに展開する ```sh $ mb-util --image_format=pbf hoge.mbtiles hoge $ cd hoge $ gzip -d -v -r -S .pbf * $ find . -type f -exec mv -v '{}' '{}'.pbf \; ```これで完成。## TIPS### mbtilesファイルの内容を確認するローカルサーバーが起動するので出力されたurlをブラウザで開いて確認する。。```sh$ npm install$ npm run tessera mbtiles://./<ファイル名>```mb-utilを使ってメタ情報を確認することもできる。```sh$ mb-util hoge.mbtiles dumps```pbf単体の内容を確認したい場合は以下。[shimizu / vt_pbf2json](https://github.com/shimizu/vt_pbf2json)*/}).heredoc(); var md = marked(doc);d3.select("body").html(md); d3.selectAll("body pre").each(function() { hljs.highlightBlock(this, this.className);});</script> </body></html> https://cdnjs.cloudflare.com/ajax/libs/marked/0.3.2/marked.min.js
https://cdnjs.cloudflare.com/ajax/libs/d3/4.3.0/d3.min.js
https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js