Google Maps API で場所アイコンのポップアップ (POI) を消す (v3.26)
地図を使った Web ページを作るときに便利な Google Maps JavaScript API だが、自分で用意したマーカなどの要素とは別に、主要なスポットがアイコンとラベルで示され、クリックするとその説明が出るようになっている。（このスポットを point of interest; POI と呼ぶ）
ただ単に地図を見るときには役立つが、API を使って何か作ろうという場合は邪魔になることがほとんどだ。
2014年には InfoWindow クラスの動作を無理やり書き換えることでこのポップアップが表示されるのを回避していたが、新しくオプションパラメータが追加されたので今後はそちらを使用する。
POI をクリックできないようにするには google.maps.Map のオプション clickableIcons を false に設定すればよい。
var map = new google.maps.Map(mapEl, { ..., clickableIcons: false });
macOS でのファイル・フォルダ比較は CompareMerge がおすすめ
CompareMerge は次の記事で紹介した WinMerge に画面・操作方法が似た macOS 用ソフトウェア。
単純にファイルの行を比較するだけでなく、行内の文字についても比較してくれる。フォルダ同士の比較も可能で、ファイル名によってフィルタリングできる。
フォルダ同士の比較では option + カーソルキー上下で差異へ移動し、return キーでファイル同士の比較画面を開いて内容を確認できる。command + W でファイル比較画面を閉じ、option + command + カーソルキー左右で選択したファイルのコピーができる。
コーディング用フォント Emberiza Sans を公開
Emberiza Sans はコーディング／プログラミングのために開発されたフォントです。フォントのダウンロードページはこちら。
制作の経緯
現在コーディング用として公開されているフォントは固定幅のものばかりだ。唯一の例外である Input も、伝統的な欧文書体と大きくプロポーションが異なっている。
一方「普通」の文字幅を持ち、視認性に長けるヒューマニストサンセリフである Avenir や Lucida Sans, Myriad, Segoe などはプログラミングに使われることを想定して作られたわけではないので、一部の文字や記号が判別しづらかったり、隣り合う文字同士がくっついて見にくかったりする。
その中で 1996 年に提供開始された Verdana は、視認性・記号の分離という点において非常に優秀だ。そして小サイズでも文字が潰れないように x-ハイトがかなり高く作られている。しかしながら画面が広く、高解像度になった現代のディスプレイでは、 x-ハイトの高さゆえに画面上に文字が溢れたようになり、やや煩さを感じる。
そこで、コード上で重要な記号の判別性を保ちつつ、現代のディスプレイ環境に合った密度で表示できるコーディング用フォントを作ることに決めた。
デザイン上の特徴
ヒューマニストサンセリフの書体は現代的なプロポーションを持っていることが多いが、 Emberiza Sans は伝統的なローマン体に近い骨格を持っている。
また b d p q のボール部分は全体の雰囲気を損なわない程度に非対称になっており、これが鏡文字として誤認されるのを防いでいる。
幅広の記号類
Emberiza Sans はコーディングに使用する記号が隣接する文字に接触してしまわないよう、次の記号のサイドベアリングを広く取っている。
また次の記号は演算子として使われることも考慮し、位置と大きさを変更している。
似た文字の区別
固定幅のフォントでは 0 ゼロと O オーを区別するために 0 ゼロに斜線や点が入っているものが多い。一方 Emberiza Sans の場合はもともと O オーが円に近い形状になっているため、見比べるまでもなく 0 ゼロと違うことが分かる。
また l 小文字エル、I 大文字アイ、1 数字のイチについては、I 大文字アイにのみセリフを付ける処理を施している。まず 1 数字のイチは起筆部の出っぱりで区別がつく。そして l 小文字エルは collection のような単語で連続して使用されることも多く、終端を曲げたりすると文字を並べたときに煩雑になり、かえって視認性が下がる。
そして I 大文字アイにセリフを付けた最大の理由は、プログラムの識別子はパスカルケースやキャメルケースが使われることがあり、そこに何もつけていない普通のアイが来ると単語の始まりとして認識しづらいためだ。
今後の課題
- 複数ウェイトの作成： 現在は Regular のみだが、ディスプレイ環境に応じて特に Light から Medium 相当の細いウェイトを充実させる。また、シンタックスハイライトで太字を使用するエディタもあるので、最低でも 1 ウェイト用意する。
- イタリック体の作成： 一部のエディタはコメント等にイタリック体を使用するものがあるのであったほうがよい。
- TrueType ヒンティング： Windows のネイティブ API を使用して文字を描画しているエディタではレンダリングの品質が悪い。そのためサイズによって文字のアウトラインを変形できる TrueType 形式を用意し、ヒンティングを施す。ただし作業量が莫大になるので後回しになると思う。
Noto Sans Display / Noto Serif Display を使おう
自由に使用・改変ができ、収録文字数も豊富、極細から極太まで揃っている向かうところ敵なしということで話題となった Noto Sans / Noto Serif （和文はそれぞれ源ノ角ゴシック、源ノ明朝と呼ばれる）。
このフォントファミリー（統一されたデザインを持ちながら、太さやスタイルを変えて作られた書体グループ）には Display スタイルのフォントが用意されているのはご存知だろうか。
収録文字はラテン文字（いわゆるアルファベット）、キリル文字、ギリシャ文字に限られるが、見出しなどで十分利用価値はある。
Display スタイルとは
ファミリー内で Display と名の付くフォントは、大きなサイズで使用するためのもので、次の特徴がある。
- 大きなサイズで美しく見えるよう、線の向きや長さなどが異なる
- 細い線が文字を大きくしても細く見えるよう、より細く作られている（冒頭の画像を参照）
- 文字間が間延びするのを避けるため、通常よりも狭く作られている
Noto Sans の場合、S の形や a, n の曲線と縦線の接続部分の違いが顕著だ。もともと画面表示用に作られているため、通常の Noto Sans は拡大すると野暮ったいところがある。
Condensed スタイル
Noto Sans/Serif Display には、主に限られたスペースに情報を載せるための、文字幅を狭くしたコンデンスドスタイルも用意されている。しかも文字幅が異なる3種類が用意されている。
- Normal（無印）
- SemiCondensed
- Condensed
- ExtraCondensed
さらにそれぞれのコンデンスドスタイルに対し、9種類のウェイトとイタリック体が用意されている。
- Thin
- ExtraLight
- Light
- Regular
- Medium
- SemiBold
- Bold
- ExtraBold
- Black
