2012_Earthquakes_Mag5.kml の内容は、次のようになっています。
「2012_Earthquakes_Mag5.kml」
<?xml version="1.0" encoding="UTF-8"?> <kml xmlns="http://earth.google.com/kml/2.0" xmlns:atom="http://www.w3.org/2005/Atom"> <Document> <name>2012 Earthquakes, Magnitude 5</name> <atom:author> <atom:name>U.S. Geological Survey</atom:name> </atom:author> <atom:link href="http://earthquake.usgs.gov" />
<Folder> <name>Magnitude 5</name> <Placemark id="2012 Jan 15 13:40:16.40 UTC"> <name>M 5.9 - 2012 Jan 15, SOUTH SHETLAND ISLANDS<</name> <magnitude>5.9</magnitude> <Point> <coordinates>-56.072,-60.975,0</coordinates> </Point> </Placemark>
<Placemark id="2012 Jan 19 06:48:48.75 UTC">---
「234-ol3ex.js」
var vector = new ol.layer.Heatmap({
/** ol.layer.Heatmap
* Layer for rendering vector data as a heatmap.
* Note that any property set in the options is set
* as a ol.Object property on the layer object;
* for example, setting title: 'My Title' in the options
* means that title is observable, and has get/set accessors.
* ヒートマップとしてベクトルデータをレンダリングするためのレイ
* ヤ。オプションで設定したすべてのプロパティは、レイヤオブジェ
* クトで ol.Object プロパティとして設定されていることに注意し
* てください。たとえば、オプションでタイトル「My Title」を設
* 定することは、タイトルが識別され、アクセサ（アクス機構）を得
* るまたは設定することを意味します。（0l3 API）
*/
source: new ol.source.KML({
/** ol.source.KML
* Static vector source in KML format
* KML フォーマットの静的ベクタソース（0l3 API）
*/
extractStyles: false, projection: 'EPSG:3857', // url: 'data/kml/2012_Earthquakes_Mag5.kml' url: 'v3.0.0/examples/data/kml/2012_Earthquakes_Mag5.kml' // 修正 }), radius: 5 });
vector.getSource().on('addfeature', function(event) {
/** 2012_Earthquakes_Mag5.kml stores the magnitude of each
* earthquake in a standards-violating <magnitude>
* tag in each Placemark. We extract it from the
* Placemark's name instead.
* 2012_Earthquakes_Mag5.kml は、それぞれの Placemark に標準
* 規格に違反する <magnitude> タグに各地震のマグニチュードを
* 格納します。私たちは、代わりに Placemark 名からそれを抽出しま
* す。
*/
/** getSource() * Return: Source（al3 API） */
/** on() * Listen for a certain type of event. * あるイベントの型をリッスンします。（al3 API） */
var name = event.feature.get('name');
/** event
* Instance of an Event that is available to an event
* handler.
* イベントハンドラで使用できるイベントのインスタンス。
*/
/** get(key) * Gets a value. * （ol3 API[説明は Stable Only のチェックを外すと表示]） */
var magnitude = parseFloat(name.substr(2)); /** parseFloat() * 引数として与えられた文字列を解析し、浮動小数点数を返します。 * （MDN[https://developer.mozilla.org/ja/docs/Web/ * JavaScript/Reference/Global_Objects/parseFloat]） */ /** String.prototype.substr() * The substr() method returns the characters in a * string beginning at the specified location * through the specified number of characters. * substr（）メソッドは、文字列内の指定した位置から始まり、 * 指定した文字数のまでの文字を返します。 * （MDN[https://developer.mozilla.org/en-US/docs/Web/ * JavaScript/Reference/Global_Objects/String/substr]） */
event.feature.set('weight', magnitude - 5);
/** set(key, value)
* Sets a value.
* （ol3 API[説明は Stable Only のチェックを外すと表示]）
*/
});
var raster = new ol.layer.Tile({
/** ol.layer.Tile
* For layer sources that provide pre-rendered, tiled
* images in grids that are organized by zoom levels for
* specific resolutions.
* プリレンダリング（事前描画）を提供するレイヤソースのための、
* 特定の解像度でのズームレベルによって編成されているグリッドの
* タイルイメージ。（ol3 API）
*/
source: new ol.source.Stamen({
/** ol.source.Stamen
* Layer source for the Stamen tile server.
* Stamen タイルサーバのレイヤソース。（ol3 API）
* （2 - ol3ex 24b - Stamen example 2 参照）
*/
layer: 'toner'
})
});
var map = new ol.Map({
layers: [raster, vector],
target: 'map',
view: new ol.View({
center: [0, 0],
zoom: 2
})
});
