O
ン：start_location
myRoute.steps[i].start_location
O
ン ン ：end_location myRoute.steps[i].end_location
{ "status" "OK", "routes" [ {
"summary" "I- W", "legs" [ {
"steps" [ {
"travel_mode" "DRIVING", "start_location" {
"lat" . , "lng" - .
},
"end_location" { "lat" . , "lng" - .
},
※引用先：
https //developers.google.com/maps/documentation/directi ons/?hl=ja
ー ー ーを置く例
O
ン緯度経度 利用
var myRoute = directionResult.routes[ ].legs[ ] for var i = i < myRoute.steps.length i++ { var marker = new google.maps.Marker {
// ン 緯度経度 位置指定
position myRoute.steps[i].start_location, map map
}
※参照用 ン ：DirectResult_stepmkr.html
Web Speech AwI ついて
※HIS 講習会 京都 芸繊維大学 荒木准教授 資料 引用
Web Speech AwI と
O W C Web Speech API Specification 定義
O
音声認識 音声合成 いI/F
定義O
式 勧告 いO
将来勧告へ 動い い わ いO
全 機能 実装 いO
ン ン 異 い 事 あ対応状況 4.9
※引用先：http //caniuse.com/#feat=web-speech
音声認識
基本的 音声認識 AwI
// 認識 行う ン ン 作成
var recognition = new webkitSpeechRecognition
// 言語 指定日本語：ja-JP 米語：en-US 英語：en-GB recognition .lang = "ja-JP"
recognition .onresult = function event {
// 結果 返 来 場合
if event.results.length > {
// z 番目 入力, 次 番目 候補 結果文字列 transcript p .value = event.results[ ][ ].transcript
}
結果文字列
最初 番目 候補 最初 番目
入力
ebkitSpeechRecognition 属性
O lang
認識対象 言語O 日本語：ja-JP, 米語 en-US, 英語 en-GB
O continuous
認識 連続 行うO false 発話 切 目 い 結果 返
O true 切 目毎 い 結果 返し続
O i nterimResults
途中結果O false 最終結果 返
O true 途中結果 返
O
maxAlternatives
認識候補数：ebkitSpeechRecognition ソッ
O onstart
音声認識 開始O onend
音声認識 終了O onerror SpeechRecognitionError
ン ン 返O onresult SpeechRecognitionEvent
ン ン 返音声合成 AwI 最も単純 例
<script type="text/javascript">
// 合成内容を表すインスタンス
：SpeechSynthesisUtterance()
var msg = new SpeechSynthesisUtterance();
msg.text = 'これ 音声合成 テス です';
msg.lang = 'ja-JP';
// speak メソッ 呼び出し
window.speechSynthesis.speak(msg);
</script>
HIS 講習会 京都 芸繊維大学荒木准教授 資料 引用
speechSynthesis ソッ
O
音声合成O speak SpeechSynthesisUtterance utterance
開始O pause
時停O resume
時停 し い 合成 再開O cancel
即時停SpeechSynthesisUtte 1nce 属性
O text
発話内容O lang
言語O 日本語
'ja-JP'
米語'en-US'
英語'en-GB
function tts str {
var msg = new SpeechSynthesisUtterance str // lang 対象言語
msg.lang = 'ja-JP'
speechSynthesis.speak msg }
St eetVie ついて
St eetVie と ？
O 指定 道路 対象範 全体 度
表示 事 可能
O 画像 StreetViewPanorama 使
用
google.maps.StreetViewPanorama document.getElementById pano , panoramaOptions
O 各地 あ 地
getStreetView ソ 得
※今回 利用し い
St eetVie コン
O DOM
要素HTML <div>
要素 内StreetViewPanorama
表示StreetViewPanorama
ンDOM
要素 渡
O
画像 最適 表示 最小x
推奨
ー ビュー 場所と視点 POV
Var kyoto = new google.maps.LatLng . , . Google Maps 設定
position kyoto, // streetview 中心 位置 pov { // streetview 場所 視点
heading , // 視点 向 時 向 度 東
pitch , // 角度
zoom //
}} //
var panorama =
new google.maps.StreetViewPanorama document.getElementById pano , panoramaOptions
map.setStreetView panorama // 地
作成後 setPosition setPov 場所 視点 変更可能
視点を ー 進行方向へ 変更
O 利用
O ョン 関数
computeHeading
利用２点間 角度 計算
O 今回 ン ン
ン 緯度経度 用い 計算
O
data :
ンO
data :
ン ンheading =google.maps.geometry.spherical.
computeHeading data , data
ー ビュー ータへ 直接 ク
O ン
画像 得 機能 利用
O
getPanoramaByLocation
緯度経度検索し 半径
m
以内 位置 番近いvar sv = new google.maps.StreetViewService
// data
緯度経度 半径sv .getPanoramaByLocation data , , processSVData
St eetVie w1no 1m1)1t1 ク 仕様
O
形式含
{ location {
latLng LatLng, description string, pano string
}, copyright string, links [{
heading number, description string, pano string,
roadColor string, roadOpacity number }],
省略
引用
先https //developers.google.com/maps/docu mentation/javascript/streetview?hl=ja#StreetVi ewService
ー ビュー ク 作成
O StreetViewPanorama 作成 O setPano 呼び出
O location.pano 指定 ID 渡
O status 記 通
O ok： 致 あ
O ZERO_RESULTS：条件 合致 い状態
O UNKNOWN_ERROR： 処理
理由 不明