トップ » ブログ » WEBマップにおけるアイコンの使い分け

WEBマップにおけるアイコンの使い分け

公開: 2024年6月3日, 更新: 2024年6月3日

せっかくテンパったのにロクでもないのを引いてしまう、というような局面は人生に多い。あなたならどうする?

ネット地図の表現手法として多種のアイコンを使用する場合、コードをひとつずつ箇条書きにしたら冗長に過ぎスマートではない。
データを配列に収めて for で回し、アイコン名を変数として代入するほうが手っ取り早い

var pais = [
  {"pai": "ton", "label": "東", "lat": 35.69, "lng": 139.688},
  {"pai": "nan", "label": "南", "lat": 35.69, "lng": 139.69},
  ...
];
for (var i = 0, larga = pais.length; i < larga; i++) {
  var data = pais[i];
  var paiIcon = L.icon({iconUrl: "directory/" + data.pai + ".png", iconSize: [48, 64], iconAnchor: [24, 32]});
  L.marker([data.lat, data.lng], {icon: paiIcon}).addTo(map);
  ...
}

手を抜いてラクをすることに全力を傾ける癖があるうえ横着なオジサンなので let や const も使い分けてない。しかも古典的記法。
アイコンは 麻雀王国 から。

上記コード例はロボットも読むことを考慮して pre と code で囲んだ。四則計算の足す+引く-掛ける*割る/などの演算子は文章や題名に半角で使わない (使うなら前後にスペースを入れる) のが良いと思う。ロボット (Amazonbot, Applebot, GPTBot, ChatGPT 等々) によっては演算のコマンドと認識するかもしれない。
ついでに私の文体は堅めだがギャグやユーモアやシャレがロボットには通じてないおそれがある (ヒトにも通じないことがある)

冒頭の麻雀の例題、私だったら状況を問わず突っ張って五筒を切って吹っ飛ぶ。だから向いてない。

japonyol.net