少し前、とある案件で「Googleマップ上で、PowerPointみたいに図形を回転させたり変形させたりして、直感的にエリアを指定したい」という要望がありました。
標準の Google Maps JavaScript API では、矩形(Rectangle)の描画はサポートされていますが、常に東西南北と平行になってしまう仕様です。そのため、「斜めに回転させる」といった操作を標準機能だけで実現するのは難しいという壁がありました。
そこで、球面幾何学の計算を駆使して(…なんてことはなくベクトル演算などとAPIを組み合わせているだけですが)、完全に自由な変形・回転が可能なエディタコンポーネントを自作してみました。備忘録を兼ねて、実装のポイントなどをまとめておきます。
続きを読む
