Quantcast
Channel: 質問!ITmedia 新着質問(Java/253)
Viewing all articles
Browse latest Browse all 2439

列車の現在位置を表示するhtmlを作りたい。

$
0
0
列車の現在位置を表して列車が動く様子を表現したいです。 以下のURLでは列車が動く様子が再現されていますが、数値がよくがわからないのです。そして列車がアニメーションで動く様子を表した画像も掲載しております。 http://chocoden.chobi.net/yamanote/yamanote_now.html こういった複雑なアニメーションはcssだけではできないのでjavascriptを使用しているものだと思われます。 駅データの五反田駅の前にある009とか、線路位置データの最初のほうにある[ 6196, 7285 ],とか、ダイヤグラムのほうにある"01G": "210438093725777",がわからないです。01gはおそらく列車番号のことを指しているものだと思われます。 // 駅データ aSt: [ "000*大崎,Ōsaki", "009 五反田,Gotanda", "020 目黒,Meguro", "035 恵比寿,Ebisu", この間省略 ], // 線路位置データ aLoc: [ [ 6196, 7285 ], [ 6206, 7279 ], [ 6213, 7272 ], [ 6221, 7267 ], [ 6229, 7261 ], [ 6237, 7255 ], [ 6244, 7250 ], [ 6252, 7244 ], [ 6260, 7238 ], [ 6267, 7232 ], [ 6274, 7225 ], [ 6280, 7217 ], この間省略 ], // 駅数の取得: 引数=なし, 戻り値=駅数 getStNum: function() { return this.aSt.length; }, // 駅情報の取得: 引数=駅番号0-29, 戻り値=文字列 getStData: function(n) { if (!((n >= 0) && (n < this.getStNum()))) n = 0; return this.aSt[n]; }, // 駅位置の取得: 引数=駅番号0-29, 戻り値=駅位置0-344 getStPos: function(n) { if (n == this.getStNum()) return 344; return parseInt(this.getStData(n).slice(0, 3), 10); }, // 駅マークの取得: 引数=駅番号0-29, 戻り値=マーク有無 isStMark: function(n) { return (this.getStData(n).charAt(3) == "*"); }, // 駅名の取得: 引数=駅番号0-29/言語0-1, 戻り値=文字列 getStName: function(n, lang) { var str = this.getStData(n).slice(4); var pos = str.indexOf(","); if (pos > 0) { str = lang ? str.slice(pos + 1) : str.slice(0, pos); } return str; }, // 駅番号の検索: 引数=駅名, 戻り値=数値 searchStName: function(s) { var n = -1; if (s) { for (var i = 0; i < this.getStNum(); i++) { if ((s == this.getStName(i, false)) || (s == this.getStName(i, true))) { n = i; break; } } } return n; }, // ダイヤ情報 diaData: null, // 平日ダイヤ weekday: { // ダイヤ名 name: "Weekday", name_jp: "平日", // 運行順番 orderOut: [ "01G", "31G", "13G", "33G", "45G", "53G", "15G", "17G", "35G", "61G", "37G", "19G", "47G", "39G", "05G", "21G", "41G", "07G", "43G", "49G", "23G", "03G", "25G", "09G", "27G", "11G", "51G", "29G" ], orderIn: [ "00G", "10G", "64G", "32G", "76G", "12G", "24G", "80G", "02G", "14G", "66G", "26G", "34G", "60G", "16G", "68G", "28G", "04G", "18G", "70G", "36G", "30G", "62G", "06G", "20G", "72G", "08G", "22G", "74G", "78G" ], // 運用変更テーブル changeOutDaytm: [ "31G", "13G", "15G", "17G", "35G", "19G", "39G", "05G", "41G", "07G", "23G", "03G", "25G", "11G", "29G" ], changeInDaytm: [ "00G", "64G", "76G", "24G", "02G", "14G", "60G", "16G", "68G", "04G", "30G", "62G", "06G", "08G", "74G" ], changeOutNight: [ "31G", "13G", "45G", "53G", "15G", "17G", "35G", "19G", "47G", "39G", "05G", "41G", "07G", "49G", "23G", "03G", "25G", "11G", "51G", "29G" ], changeInNight: [ "00G", "64G", "32G", "76G", "24G", "80G", "02G", "14G", "34G", "60G", "16G", "68G", "04G", "36G", "30G", "62G", "06G", "08G", "74G", "78G" ], // ダイヤ diagram: { // 外回り "01G": "210438093725777", "03G": "04042724316589965555687678A", "05G": "2305112516246896555577776899", "07G": "04052524185889655555777699",

Viewing all articles
Browse latest Browse all 2439

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>