var rosen;

function init() {
  rosen = new Rosen("map", {
    apiKey: "2jr5nchcswemrfjj67jvjaqu", // アクセスキーはサンプル用です。実際にご利用されるときは書き換えてください。
    center: [30445, 24713, 16],
    zoom: 16
  });

  // 1．画像のポップアップ（東京）
  // ポップアップクラスを生成
  var image_popup = Rosen.imagePopup();
  image_popup.setImageUrl("http://bit.ly/1zdWxgB"); // 横300px以上の画像
  image_popup.setComment("this is 東京駅");
  // 路線図にポップアップをセット
  rosen.setStationPopup(22828, image_popup);

  // 2．文字列のポップアップ（飯田橋）
  // textPopupはHTMLタグ無効
  // ポップアップクラスを生成
  var text_popup = Rosen.textPopup();
  text_popup.setComment('飯田橋駅（いいだばしえき）は、東京都千代田区・新宿区・文京区にある、東日本旅客鉄道（JR東日本）・東京地下鉄（東京メトロ）・東京都交通局（都営地下鉄）の駅である。');
  text_popup.setAnchor("http://ja.wikipedia.org/wiki/%E9%A3%AF%E7%94%B0%E6%A9%8B%E9%A7%85");  // リンク先
  // 路線図にポップアップをセット
  rosen.setStationPopup(22507, text_popup);

  // 3．HTMLのポップアップ（高円寺）
  // htmlPopupはHTMLタグ有効
  // ポップアップクラスを生成
  var html_popup = Rosen.htmlPopup();
  html_popup.setContent('<img src="http://www.val.co.jp/images/footer/mainimg_matinamikun.png" width="300" height="137"><br>「まちなみくん」は、私達が住んでいる街並みの“影”から<br>誕生した<a href="http://www.val.co.jp/" target="_blank">ヴァル研究所</a>のオリジナルキャラクターです。');
  // 路線図にポップアップをセット
  rosen.setStationPopup(22671, html_popup);
}
window.addEventListener('load', init);