OpenLayers で東京都の地図表示 10d Google Pisca で位置情報のある写真を表示4

ポップアップ表示をするため、KML Layer Example（sundials.html）を参考に次のコードを追加します。
前述のコードは削除してください。

---
var sundials = new OpenLayers.Layer.Vector("西立川駅", {
 projection: map.displayProjection,
 strategies: [new OpenLayers.Strategy.Fixed()], //一度だけ feature を要求
 protocol: new OpenLayers.Protocol.HTTP({ //ベクトルレイヤのための基本的な HTTP プロトコル
  url: "西立川駅.kml",
   format: new OpenLayers.Format.KML({
    extractStyles: true, //スタイルの週出
    extractAttributes: true //属性の抽出
    })
  })
});
            
map.addLayer(sundials);
            
select = new OpenLayers.Control.SelectFeature(sundials);
            
sundials.events.on({
 "featureselected": onFeatureSelect, // ポップアップ表示時のPointの色
 "featureunselected": onFeatureUnselect // ポップアップを閉じたとき元に戻す
});

map.addControl(select);
select.activate();   

map.addControl(new OpenLayers.Control.LayerSwitcher());
---
function onPopupClose(evt) {
 select.unselectAll();
}
function onFeatureSelect(event) {
 var feature = event.feature;
 // Since KML is user-generated, do naive protection against
 // Javascript.
var content = "<h2>"+feature.attributes.firstChild.name + "</h2>" + feature.attributes.description; // Placemark の子要素 name と description の表示
if (content.search("<script") != -1) {
 content = "Content contained Javascript! Escaped content below.<br />" + content.replace(/</g, "<");
}
popup = new OpenLayers.Popup.FramedCloud("chicken", 
 feature.geometry.getBounds().getCenterLonLat(),
 new OpenLayers.Size(100,100),
 content,
 null, true, onPopupClose);
feature.popup = popup;
map.addPopup(popup);
}
function onFeatureUnselect(event) {
 var feature = event.feature;
 if(feature.popup) {
  map.removePopup(feature.popup);
  feature.popup.destroy();
  delete feature.popup;
 }
}

</script>
---