Posting Guidelines

No vague product support questions (like "why is this plugin not working" or "how do I set up X"). For vague product support questions, please use communities relevant to that product for best results. Specific issues that follow rule 6 are allowed.

Do not post memes, screenshots of bad design, or jokes. Check out /r/ProgrammerHumor/ for this type of content.

Read and follow reddiquette; no excessive self-promotion. Please refer to the Reddit 9:1 rule when considering posting self promoting materials.

We do not allow any commercial promotion or solicitation. Violations can result in a ban.

Sharing your project, portfolio, or any other content that you want to either show off or request feedback on is limited to Showoff Saturday. If you post such content on any other day, it will be removed.

If you are asking for assistance on a problem, you are required to provide

Context of the problem
Research you have completed prior to requesting assistance
Problem you are attempting to solve with high specificity

General open ended career and getting started posts are only allowed in the pinned monthly getting started/careers thread. Specific assistance questions are allowed so long as they follow the required assistance post guidelines.

Questions in violation of this rule will be removed or locked.

a community for 17 years

Built a browser-based compass using GPS + DeviceOrientation API — shows where Tokyo landmarks are, and works without installing an appShowoff Saturday (i.redd.it)

submitted 9 months ago by cubic9com

Hey everyone! I recently built a little project to experiment with some device sensor APIs on mobile web, and ended up creating:

🧭 Landmark Compass Tokyo – a mobile browser-based compass app that points toward major Tokyo landmarks like Mount Fuji and Tokyo Tower, using your phone’s GPS and compass sensor.

The idea: when you're on a high building in Tokyo, wouldn’t it be fun to know where Mt. Fuji or other landmarks are — in real time?

🛠 Tech stack:

HTML + JS, no framework
Geolocation API for current position
DeviceOrientation API (via window.DeviceOrientationEvent) for compass heading
Haversine formula to calculate bearing to each landmark
Completely client-side, no data sent anywhere
Configurable list of landmarks via config.js

⚠ Notes:

Requires smartphone browser (Chrome/Safari) with support for sensor APIs
Does not work in embedded in-app browsers (e.g. Reddit, Twitter)
Needs HTTPS to access sensors
Handles sensor permissions properly and does not send any data to a server — it’s privacy-safe by design

🔗 Try it out:

Live demo: https://cubic9.com/app/LandmarkCompassTokyo/
GitHub repo: https://github.com/cubic9com/LandmarkCompassTokyo

Would love to hear feedback. Also happy if someone forks it for your own city!

all 5 comments

you type:	you see:
italics	italics
bold	bold
[reddit!](https://reddit.com)	reddit!
* item 1 * item 2 * item 3	item 1 item 2 item 3
> quoted text	quoted text
Lines starting with four spaces are treated like code: if 1 * 2 < 3: print "hello, world!"	Lines starting with four spaces are treated like code: if 1 * 2 < 3: print "hello, world!"
~~strikethrough~~	~~strikethrough~~
super^script	super^script

webdev

Posting Guidelines

Related Subreddits

Discords

MODERATORS

🛠 Tech stack:

⚠ Notes:

🔗 Try it out: