2022年1月16日 / 最終更新日時 : 2022年1月16日 とれいる OpenLayers 【OpenLayers 6】マップを固定する方法 はじめに マップを画像のようにサイトへと埋め込みたい場合、スクロールやズームが動作してしまうとかえって扱いづらくなってしまうことがあります。そこで今回は OpenLayers を使った埋め込みマップについて、完全に固定 […]
2022年1月10日 / 最終更新日時 : 2022年1月10日 とれいる OpenLayers 【OpenLayers 6】最大/最小ズームを設定する はじめに マップの使用用途によっては、最大/最小ズームを設定して、ズームレベルを制限したい場合があります。そこで今回は、最大/最小ズームを設定する方法について説明したいと思います。 最大/最小ズームを設定する方法 マ […]
2021年12月31日 / 最終更新日時 : 2021年12月31日 とれいる OpenLayers 【OpenLayers 6】マップを回転させない方法 はじめに OpenLayers はデフォルトで、スマホやタブレットであればピンチで回転、パソコンであれば、Shift+Alt+ドラッグで回転できます。しかし、回転できてしまうと操作性が落ちてしまう場合もあるので、今回は […]
2021年12月31日 / 最終更新日時 : 2021年12月31日 とれいる OpenLayers 【OpenLayers 6】マーカーにクリックイベントを付加する はじめに マーカーは表示するだけではなくクリックイベントやポップアップイベントなどを追加すると利便性が向上します。今回は、マーカーにクリックイベントを付加して、マーカーをクリックすると別ページへとジャンプするように設定 […]
2021年12月30日 / 最終更新日時 : 2021年12月31日 とれいる OpenLayers 【OpenLayers 6】ズームレベルに応じてマーカーの表示/非表示を切り替える はじめに マーカーをマップ上に増やしていくと、広域表示でごちゃごちゃするので、ズームレベルに応じてマーカーを非表示にしたくなる場合があります。今回は、ズームレベルでマーカーの表示/非表示を切り替える方法について説明した […]
2021年12月29日 / 最終更新日時 : 2021年12月30日 とれいる OpenLayers 【OpenLayers 6】複数のテキストを配置する はじめに マップ上にテキストを配置したいと思うシチュエーションは度々あります。今回はまず、マップ上にテキストを配置する方法について説明した後、複数のテキストを配置する方法について説明したいと思います。 テキストをマップ […]
2021年12月28日 / 最終更新日時 : 2021年12月30日 とれいる OpenLayers 【OpenLayers 6】マップ上にラインを描画する はじめに GPS ロガーで記録したデータを地図上で表示する等、OpenLayers を使ってラインを描画したくなる場合が有ります。ここでは、KML や GPX の読み込み機能は使わないで、配列で渡した経緯度を用いてライ […]
2021年12月27日 / 最終更新日時 : 2021年12月30日 とれいる OpenLayers 【OpenLayers 6】マップ上にマーカーを配置する はじめに サイトやブログで相手に場所を伝えるとき、記事内にマップを埋め込むと効果的ですが、そういった場合にはマーカーを配置すると分かりやすいです。そこで今回は、OpenLayers 6 でマーカーを配置する方法について […]
2021年12月26日 / 最終更新日時 : 2021年12月31日 とれいる OpenLayers 【OpenLayers 6】マップタイルを切り替える はじめに マップタイルには、Google Maps のような有料の物だけでなく、OpenStreetMap や国が公開しているデータなど様々なオープンデータも存在します。今回は OpenLayers 6 で、それらのマ […]
2021年12月25日 / 最終更新日時 : 2023年10月10日 とれいる OpenLayers 【OpenLayers 8】埋め込み地図を表示させる方法 はじめに OpenLayers とは、ブラウザでマップデータを表示する、JavaScript のオープンソースライブラリです。Web サイト上にマップをカスタマイズして埋め込む場合、Google Maps だと料金体系 […]