2017年12月17日日曜日

OpenLayers 3 を使ってみよう(番外5:JavaScript で KML データと GPX データを読み込む方法)

OpenLayers 3 を使ってみよう(その0:はじめに:地理院地図を表示)に目次がある。

  前回(その22:Highcharts でルートの標高グラフの改良)は,Highcharts を使った標高図の表示の改良について書いた。 そこでは,JavaScript で KML 形式のデータファイルから直接データを読み込むはやめて,OpenLayers として読み込んだ KML データの vector データから標高図のデータを取得した。 しかし,JavaScript で KML や GPX などの XML 形式のデータを読み込む方法を調べたので,せっかくなのでまとめておこうと思う。

 XML データについては,https://www.w3schools.com/XML Tutorialを参考にした。 特に XML の各タグの属性(attribute)については XML Attributes が参考になった。

OpenLayers 3 を使ってみよう(その22:Highcharts でルートの標高グラフの改良)

 これは,OpenLayers 3 を使ってみよう(その21:Highcharts でルートの標高グラフを表示)の続きというか改良版になる。 OpenLayers 3 を使ってみよう(その0:はじめに:地理院地図を表示)に目次がある。 その13までのページでは OpenLayers v3.7.0 で書いてきたが,ここでは OpenLayers 3.20.1 で書かれている。
 前回(その21:Highcharts でルートの標高グラフを表示)は,Highcharts を使って標高図を追加してみた。 ただ,前回は少し無駄なことをしていたので,少しだけ改良してみた,というのが今回のお話。