TE
TechEcho
Home24h TopNewestBestAskShowJobs
GitHubTwitter
Home

TechEcho

A tech news platform built with Next.js, providing global tech news and discussions.

GitHubTwitter

Home

HomeNewestBestAskShowJobs

Resources

HackerNews APIOriginal HackerNewsNext.js

© 2025 TechEcho. All rights reserved.

Show HN: Vector Charts – Add Nautical Charts to Your Web App

4 pointsby chrisdalke10 days ago
(TLDR: I made a new API to render maritime maps. If you just want to scroll around for fun, check out <a href="https:&#x2F;&#x2F;app.vectorcharts.com&#x2F;" rel="nofollow">https:&#x2F;&#x2F;app.vectorcharts.com&#x2F;</a>, a free nautical chart viewer. And if you&#x27;re interested in using nautical charts in your app, just sign up or reach out at <a href="https:&#x2F;&#x2F;vectorcharts.com&#x2F;contact-us&#x2F;" rel="nofollow">https:&#x2F;&#x2F;vectorcharts.com&#x2F;contact-us&#x2F;</a> - I&#x27;d love to help you!)<p>Hi HN! I&#x27;m making Vector Charts, an API product which allows nautical charts to easily be added to web apps. Vector Charts provides a Vector Tile API that you can use to embed nautical charts into any web-based map. We&#x27;re putting a lot of work into styling and modernizing the map experience so anyone building maritime-related web apps can use charts.<p>&quot;Nautical Charts&quot; are maritime-specific maps that show the structure of the ocean environment, above and below water. Among other info, they show bathymetry contours, which help avoid boats running aground. They&#x27;re relied on by both professional and recreational mariners to navigate safely and are a mature technology that&#x27;s been around for many years.<p>I&#x27;ve been working in the marine software space for years, and adding nautical charts to web applications is a frequent requirement. But there are a few problems with existing SDKs: First, they&#x27;re generally too expensive for small web apps, due to the fact that they&#x27;re designed for safety-critical user interfaces used for navigation on commercial vessels. Second, existing options generally render as raster images, which leads to a blurry or pixelated and cluttered view when used inside a web-based map.<p>Vector Charts focuses on non-safety-critical web experiences that might benefit from nautical charts, which is a growing segment of the market. We want to be the &quot;Mapbox for Nautical Charts&quot; - The easiest &amp; highest quality option to add nautical charts to a map.<p>A few examples of where this is useful: A live tracking map for a sailboat race, a watersports logging app, or an unmanned surface vessel C2 software. Anywhere that you&#x27;re building a web app for a marine setting, nautical charts are likely a better background layer than satellite.<p>Right now I&#x27;m in testing this with customers, improving styling &amp; data quality - So there might be data inconsistencies or missing layers. But the API is live and you can play with it now using the example app!

2 comments

chrisdalke10 days ago
On a technical level, this is a perfect use-case for PostGIS, which I&#x27;m a huge fan of.<p>Charts are hand-authored by government hydrography offices and encoded into a format called &quot;S-57&quot;. These files contain spatial data for a small area, and different charts cover different zoom levels. This presents a few problems for web apps: Charts of different intended zoom levels cover other data, the full chart dataset is too large to stream, and charts aren&#x27;t divided into xyz tiles cleanly.<p>To solve this, I run a bespoke pipeline which processes all nautical chart data into an internal format using PostGIS. From there, I merge all chart data together, overlaying higher accuracy charts over the lower accuracy charts. The pipeline performs a lot of data validation &amp; reconciliation to remove bad data, then simplifies &amp; renders to vector tiles.<p>PostGIS is critical to this - I started by using a bunch of python geometry manipulation libraries, and slowly shifted more and more of the processing into SQL queries as I realized how fast and intuitive it is.
chrisdalke10 days ago
If you just want to play around with the nautical chart rendering, check out <a href="https:&#x2F;&#x2F;app.vectorcharts.com&#x2F;" rel="nofollow">https:&#x2F;&#x2F;app.vectorcharts.com&#x2F;</a> - A free nautical chart viewer that demonstrates the vector charts API.