Trip editing improvements - v2.3.23

New features

  1. Many improvements to route editing. Of particular note is the ability to split routes using the snip tool (scissors icon in the above image).
  2. Added the ability to attach scripts to Markers. At present, this means script actions can be triggered at any of the following times.
    • When a trip is loaded.
    • At a relative point along a trip.
    • New: Marker Arrival scripts execute when in Play mode and the map center is within 1 nMi of the Marker location.
    • New: Marker Departure scripts execute when in Play mode and the map center moves 1 nMi away from the Marker location.
      In the future, the trigger distance will be programmable.
  3. Routes and Markers have a separate button to edit the name. Editing the name in place was a continuing nightmare so I went with this simpler alternative.

Bug fixes

  1. Markers can now be deleted.

Up Next

From the outset of DeepZoom V2, I’ve been contemplating whether to add user generated rich content (text, images, video) to Markers.

There are plenty of websites which attach commercial content to map markers showing marinas, gas prices, and the like, but I’ve been imagining something closes to a mashup of Twitter and Wikipedia, where you can add comments on anchorages, dive spots, fishing holes, kayaking campgrounds, etc. along with images, videos, and ratings or likes/dislikes.

But entering this arena means higher operating costs and the more serious problem of moderating user submissions.

If you have any ideas or suggestions on this topic, I’d love to hear them.

https://github.com/jaybo/deepzoom-blog/discussions/3


The TypeScript rewrite - v2.3

JavaScript, the quandary

I started writing DeepZoom in 2007??? when I knew just about nothing about the lingua franca of the web: JavaScript. Over the intervening decade and a half, I’ve worked on the code sporadically, but then really kicked into gear again in 2020 as Covid hit. As a result, the codebase was a mashup of different styles, reflecting changes in my understanding of JavaScript best practices, and adopting modern features of the language as it evolved every few years.

Overall, the experience has been terrifying. Coming from a background in strongly typed languages such as C, C++, and C#, the whole dynamic nature of JavaScript where a variable can morph to contain content of any type has been disquieting. Gary Bernhardt has a fun video on the subject of JavaScript inconsistencies: Wat

Some typical JavaScript madness:

// random JavaScript: Is k a string, a number, or something else?
let k = "you'll never take me alive, Copper!"
k = 42
k = lifeTheUniverseEverything(k)

Equally frightening, DeepZoom is directly dependent on ~40 other NPM packages (code libraries), which in turn rely on over 1,300 other libraries. Any of which can be randomly updated, bugs added or fixed, and behaviors changed. In a typical week two or three of the direct dependency libraries will be updated.

Meanwhile DeepZoom continues to grow. It’s currently about 80 files, and about 30,000 lines of code (not counting images and other assets).

find ./ -type f -regex '.*\.\(vue\|js\|ts\)$' -print0 | wc -l --files0-from=- // LOC js, ts, vue

Not huge by any means, but large enough that attempting non-trivial enhancements was a challenge. Partly because I lacked the discipline to document every function, variable, and return value, but also due to the nature of JavaScript itself. Enter … TypeScript.

The TypeScript rewrite

I’ve been casting longing glances in the direction of TypeScript for a few years. And I finally took the plunge. After flicking some switches in the Quasar tooling to enable TypeScript, I started with the simplest modules with the fewest dependencies, and just changed the file extension from .js to .ts. Add a few type definitions, and it’s working! VSCode starts showing intellisense for all variables and functions. Errors pop up when types don’t match.

The largest modules took a few days to port over; overall I spent about two months on the rewrite. During the rewrite maybe two dozen real bugs popped up due to type checking. And there were a few sections of code that I just scratched my head and wondered how/if it ever really worked.

The relief is palpable.

Fixes

  • New drawer menu on mobile devices
  • Handle the iPhone “notch” and env(safe-area-inset-*)
  • Fix all known issues with changing route names

Seattle to Glacier Bay

To test all this new functionality, I created a Trip based on our 2001 expedition from Seattle to Glacier Bay aboard s/v Serenade. The trip includes 28 routes, and has a duration of about a month.

Try it: https://www.deepzoom.com/trip/4jvmcnf6


Tide selection annoyance - v2.2.17

Oops, I broke backwards compatibility

V2.2.17 uses a slightly modified trip storage format. If you have a tide or current station selected in your old file, it will not be auto selected in a newer version of DeepZoom. Sorry, but this is a one time upgrade and it wasn’t trivial to maintain backwards compatibility.

To fix this problem, open the trip in DeepZoom. Select the station again, and then resave the trip.
Make sure Include view settings is Yes.

save a trip

If you’re one of the adventurous few who is actually writing a scripted trip, then you’ll need to manually update the tideOrCurrent entries within the script.


Tide data refresh - v2.2.112

Tide and current data refresh

All of the USA tides and currents are now updated to the latest NOAA 2022 data release. Tide and current data is available between the dates of 2014.01.01 through 2029.12.31 inclusive.

For the first time in DeepZoom, this includes coverage for currents in Chesapeake Bay, Delaware Bay, and many locations in New England.

Thanks, as always to David Flater (xtide) for collecting and publishing the .tcd files which I use to generate the millions tide fragment files which enables DeepZoom’s rapid display.

I would be delighted to extend DeepZoom tide and current coverage throughout the world.
If you know of any public domain harmonic sources please let me know!


Trip: Intracoastal Waterway

Intracoastal waterway (ICW)

Now that .gpx import is working I needed a really big trip to do some stress testing.

Ann and Bob Sherer publish a set of .gpx routes and tracks along the ICW. For reasons unknown to me, these have come to be known around the web as the Bob423 tracks.

I imported these to DeepZoom by just dragging and dropping one or more .gpx files onto the right side panel. Next I converted the tracks to routes using the handy new button on the Tracks panel. Finally I adjusted some of the departure dates to form a reasonable itinerary, and voilà, we have a trip!

The resulting 1067 nMi trip from Norfolk to Key West has seven routes, many thousand waypoints, and a trip duration of 44 days at 6.5 knots with several layovers.

Tip! You can adjust the starting date for all routes in a trip in one operation. Click “today”, +1, -1, or the calendar icon to change the start date for the earliest route and all other routes will be modified to the same relative time offset.

Try it out: https://www.deepzoom.com/trip/y88qfms3

Tip! you can add-in Bob423’s side trips and anchorages by dragging in this file.


Trip: ARC Atlantic Rally for Cruisers

Atlantic Rally for Cruisers

About 200 boats participate annually in the Atlantic Rally for Cruisers (ARC).. The 2700 nMi rally follows the trade winds from Las Palmas de Gran Canaria to Rodney Bay, Saint Lucia, in the Caribbean.

These trips are optimized to show wind direction and strength along the route. To understand how to read the windrose, see this post.

ARC 2022 Direct

This is the shorter, direct route.

Try it out: https://www.deepzoom.com/trip/6b8d958m

ARC+ 2022

The longer route departs a few days later, with a stopover in Mindelo, Sao Vicente.

Try it out: https://www.deepzoom.com/trip/bktytsf9


Import gpx and kml and export gpx - v2.2.90

New features

  1. GPX and KML files can now be imported en masse. Drag and drop one or more files (or click on the input field to get a file open dialog). You can either add them all to the existing Trip, or create a new trip.
  2. Added Export of loaded trip to .gpx file (in Downloads directory). At present, route departure time and speed are not included. I’m trying to figure out which of the numerous competing .gpx extensions to support. If you have any requests or advice on this topic, please let me know.

Bug fixes

  1. Fixed a bug in “realtime” timebase.

Earth, sun, and moon - v2.2.62

New features

This is mostly a fit and finish release. Lot’s of UI and perf improvements plus a new display of relative positions of earth, sun and moon. This animation, like everything else in DeepZoom is linked to the timebase. The timebase is accessed by clicking on the time readout at the lower center of the screen.


Find trips in View - v2.2.3

New features

  1. Added “Find” to Trips page. This will show a list of all public trips within the current view. Filters are available for “power”, “sail”, “kayak”, and “swim” along with sorting by name, length, duration, and stars.
  2. Added trip id to url so forward and back browser buttons work.

Bug fixes

  1. Fixed longstanding bug which could cause hangs, especially on Cordova demo trip.

Trip: Columbus sails to America in 1492

Historical pilot charts

Pilot Charts show probabilities of wind strength and direction for a particular location and time, to help plan optimal sailing routes. Historically, these charts were derived by manually collating the logs of thousands of vessels transiting the oceans over the last few hundred years.

Below is an excerpt from a traditional pilot chart for a portion of the southern Pacific ocean during the month of February. Each windrose covers a 5°x5° area. The length of the barb indicates the percentage of time the wind blew from that direction, and the barb style indicates the strength of the wind.

DeepZoom pilot charts

DeepZoom does the same thing on steroids. Instead of using the ship historical data, DeepZoom uses satellite derived wind strength and direction information displayed as a polar histogram.

The Pilot Charts layer lets you plan a route based on historically measured wind speeds and directions. This layer shows a probability windrose on a color coded background. The background shows mean historical wind speed along with arrows showing mean wind direction for each 14 day period.

Superimposed on this background is a windrose which shows the percentage of time the wind is blowing from each of 16 cardinal/secondary/intercardinal directions. The length of each bar shows the percentage of time the wind blows from that direction averaged over a 14 day period. The length of the colored rectangles within each bar indicates the percentage of time the wind blows with each velocity range.

Columbus trip 1

Here’s a trip showing how Columbus travelled to the Bahamas on his first voyage. The bar from due east ending in the number “42”, indicates that the wind was blowing from that cardinal direction 42% of the time. The wind was under 20 knots about 40% of the time, and there was an easterly component virtually all the time.

Columbus was likely sailing straight down wind most of the westward voyage.

Try it: https://www.deepzoom.com/trip/qe778dsf

Another cool polar histogram example

Entropy levels of 100 world cities by the orientation of streets.
Most ordered streets: Chicago, Miami, & Minneapolis.
Most disordered: Charlotte, Sao Paulo, Rome & Singapore. Paper:

city street orientation graph

credits


Recent Posts

Trip: Columbus sails to America in 1492

4 minute read

Historical pilot charts Pilot Charts show probabilities of wind strength and direction for a particular location and time, to help plan optimal sailing rout...