Skip to content

コンテンツ更新作業の手順、従来版

ISHIDA Naoto edited this page Mar 30, 2023 · 8 revisions

作業手順

最小の場合には、#データソースの収集#コンテンツのビルドからコミットまでの2項目を作業すれば完了する。 他は状況に応じて作業する。

データソースの収集

Fetch and Prepare

  • [o] ざつ旅 電撃マオウ 掲載
  • [o] ざつ旅 Web版 更新 Comic Walker
    • 各話の扉ページで、各話のサブタイトルを確認
    • 例)第22旅(後編)-北海道道東後編-無くたって良いどう
  • [o] Waypointデータのソース ざつ旅マップ 更新 Google Maps ざつ旅マップ
    • コミック登場ポイント
    • kml でダウンロード ※kmzではない
  • kml を編集
    • 好みの範囲であるが、いまのところ毎回手動で対応している→面倒なので、改善したい
    • 「第19旅」で検索→不足している「(前編)」を補う 2箇所
    • 「第26旅」で検索→不足している「(前編)」を補う 2箇所
    • 「CTRL-s CTRL-q CTRL-j <」で検索→name要素内の改行文字を削除 おそらく5箇所
    • 「[![CDATA」で検索→CDATA内の改行文字を削除 おそらく1箇所
    • 第19旅の順序を編集 棚下不動と足湯
    • 第23旅の「鋸山山頂」の順序を編集
    • (この段階でgit diffを確認すると、差分・編集漏れなどに気づくことができる場合がある←慣れたら省略可能)
  • kmlをgeojsonに変換 AnyConv
  • kmlとgeojsonを、ワークスペースへコピーする /geodata/
  • git diff 差分・編集漏れなど確認

コミック新刊の情報を得る

登場する場所(地方自治体)を調べる for_journey

新しい話(前編および後編の最初)の場合など、または行き先によって、各話ごとに、登場する場所(地方自治体)を調べる

前提:kml 更新済み

/scripts/index.js for_journey を使って、最新話のみをビルド→市区町村を列挙することができる

  • 【平常時】空文字列の場合は、全話数をビルドする
  • 単話を指定した場合には、その話数のみビルドする
  • 例)第22旅(後編)→「22-2」、第4旅→「04」
  • 実行 npm run build
  • 結果 22-2 [ '千代田区', '網走市' ]

メタデータの収集と記録

/docs/VisitSuzugamori.json エディタでファイルを編集する

VisitSuzugamoriのために集めたあらゆるメタデータを記録・保持しているファイルで、以下の4つのセクションがある

  • series ー ざつ旅 シリーズ全体を通しての事柄
  • stories ー 各話ごと
    • 各話以下の3つの要素(index, id, key)は、正直いまのところちゃんと使い分けていないand活用していない
    • place要素は、半角空白区切りで列挙
    • books要素は、コミック収録巻が確定したら値を入れる(未定義はnull)
    • camera要素は、マップ表示の際にカメラ移動するとき使う 経度緯度
  • books ー コミック各巻ごと
    • 基本的な書誌情報
    • 書影、初版発行日、isbn、オビ
  • site ー VisitSuzugamori独自の事柄

目次ページの編集

/docs/index.html エディタでファイルを編集する

  • 各話一覧&リンク
  • コミック書影&リンク
  • コミック各巻キーカラーCSS

区境データのアップデート

新しい自治体(市区町村、政令指定都市の区)が登場した場合

前提:VisitSuzugamori.json 更新 各話のplace要素で場所を記述してあること

自前のスクリプトを使って、データ整形する。 前掲の for_journey を使って調べ、 VisitSuzugamori.json を更新して、 make_geodataで、境界線描画用データを生成

npm run make_geodata
git add geodata/administrative_boundary.geojson
git commit -m 'update geodata'

Mapbox Studio

  • Sign in Mapbox Studio
  • Tilesets → Custom tilesets
  • administrative_boundary-c12k0j → replace
  • administrative_boundary.geojsonをアップロードする(キュー)
  • (wait...)
  • 画面上で描画された図形を確認。ズームレベルに注意(広域では省略表示になり、見えない)

メニュー項目「replace」の場所

コンテンツのビルドからコミットまで

ソーシャル・コンテンツの収集とhtmlのビルド(実質的にはjsの生成)は、自前のスクリプトで実施する

cd VisitSuzugamori.github.io
npm run build
(wait...)
git diff -U0
git add docs/
git commit -m 'build ocntents'
git push origin main