codeforjapan/mapprint

伊豆山のカテゴリ「携帯充電」が「入浴施設」に含まれてしまっている

Closed this issue · 5 comments

不具合の概要

  • 伊豆山のカテゴリ「携帯充電」が「入浴施設」に含まれてしまっている

再現手順

  • 伊豆山土砂崩れの地図を開き、熱海市やや北を表示する
  • jsonでcategoryを定義していない「携帯充電」が赤線白背景のピンで表示される (これはまあ期待どおり)
  • 凡例ナビで「入浴施設」を選択すると、そのピンも含めて表示されてしまっている
  • 「入浴施設」リストにその場所もリストアップされてしまっている

修正しないとどう困るか

  • 入浴したいのに入浴できない

修正案

  • jsonでcategoryを定義していないものを収容する凡例を作るのがよいかと
  • なお2019-typhoon-19 の 「避難所(茶)_台風19号_19年10月」では再現していない
    ピン色はKMLからパースしたスタイルが当たっているが、リスト色はスタイルが当たっていない

入浴施設に含まれてしまっているように見えるのですが、実際は「スタイルが未定義なので白背景に白文字となってしまい見えない」のが正しいようです

Screenshot 2024-01-06 at 22 52 28

簡単な対策としては、ピン・凡例ともに、未定義の場合の色を定義してフォールバックしてあげるのが良いと考えます

一方で、JSONで「デフォルト色」を定義出来るのがベストな気はします。

現状のコード

凡例(フォールバックがない)

:style="{backgroundColor:mapConfig.layer_settings[group.category]?.color}"

ピン色(フォールバックがある)

:style="{background:mapConfig.layer_settings[marker.category]?.color||marker.feature.properties['marker-color']||'red'}"

もし常にこれらが同じ値を示すべきなら、コードが共通化されるとよい

-> ピン色は、①カテゴリ色②地物のmarker-color値、③フォールバック、という順序で評価されているので、2つは違うロジック

ただし、marker-colorは、PrintableMap.vue以外では、MapHelper.tsでしか使われていなくて、いずれも単にcategory.colorをセットしているだけである。

https://github.com/search?q=repo%3Acodeforjapan%2Fmapprint%20marker-color&type=code

feature.properties['marker-color'] = category.color;

geojsondata.properties['marker-color'] = category.color;

なので、凡例色とピン色を同じロジックで計算しても差し支えない
また、marker-colorは現状では意味のない値なので、関係するコードを消してしまうのがよいだろう

KMLをパースして得られたスタイル情報が、marker-colorとしてセットされていて、これは生きているコード。

このIssueの根本原因はこれまで述べたとおり。ただし正しく修正するには一部設計上の障壁がある。

①:JSONに未定義の場合のカテゴリ色は、KMLをパースして得られる値をmarker-colorにセットしているわけだが、layer_settings経由ではアクセス出来ない(KMLをパースした結果のGeoJSONデータにしか含まれていない)。このパース結果も、カテゴリ名から引けるようにすることは頑張れば出来るが、対症療法という感じ。

②:JSONに未定義のカテゴリが地物に含まれている場合の処理は実は書いてあって

if (!categoryExists) {

このあたりになる。emitはされているものの、呼び出し側で処理をハンドリングしてはいないので、実際に値が更新されることはない。ハンドリングして値を更新するようにしてみると、以下のようになる。

Screenshot 2024-01-07 at 12 35 48

大きく挙動が変わるが、このあたりをまとめて修正するのが最善と思われる。
ただし変更がかなり大きくて、期待される動きが判断がつかないため、調べた結果をまとめておくにとどめる。

#475 で合わせて対応済み