running-on-streetview

This app detect your motion via WebCamera and go forward on Google Street View Map.

Requirements

• Google Maps JavaScript API Key
  • If you do not have API Key, please use "Free Trial" on https://running-on-streetview.netlify.app
• A Browser that can use Web Camera
  • Tested on Google Chrome and Macbook Pro

Usage

1. Open URL: https://running-on-streetview.netlify.app
2. Input your Google Map API Key
3. Load Google Map Street View and Running!

How to get Google Map API Key?

You can get Google Map API from Google Cloud Platform Console.

• Get an API Key Maps JavaScript API | Google Developers
• 【要確認】Google Maps Platform APIキーの取得方法と注意点 | ワードプレステーマTCD
• Google Maps PlatformのAPIキーの取得・発行について - 株式会社ゼンリンデータコム

You should add restriction to "HTTP Referer" to https://running-on-streetview.netlify.app/* for your API key.

Tips

Shortcut

• ↑: Go forward
• ←: Turn left
• →: Turn Right
• ↓: Go back forward

URL Hacking

This app support some url parameters:

• defaultMapUrl=<google street view url>
• defaultForwardStep=<number>
• throttleBackward=<number ms>
• throttleForward=<number ms>
• GOOGLE_MAP_API_KEY=<api-key>

For more details, see src/bootstrap.ts

Overlay video on FullScreen

Modern browser support Picture-in-Picture.

• Chrome: Select "Picture-in-Picture" on video element's context menu
• Firefox: https://support.mozilla.org/en-US/kb/about-picture-picture-firefox

Changelog

See Releases page.

Running tests

Install devDependencies and Run npm test:

npm test

Contributing

Pull requests and stars are always welcome. Documentation improvements is also welcome!

For bugs and feature requests, please create an issue.

1. Fork it!
2. Create your feature branch: git checkout -b my-new-feature
3. Commit your changes: git commit -am 'Add some feature'
4. Push to the branch: git push origin my-new-feature
5. Submit a pull request :D

Author

• github/azu
• twitter/azu_re

License

MIT © azu

Sponsors

Acknowledgements

• GoogleStreetViewを足踏みで仮想散歩するPGM - Qiita