The Catalyst: EU Gear Marking Regulations The project was driven by tightening EU regulations regarding the tracking of passive fishing gear. New mandates required precise marking and easier recovery of equipment to combat marine litter and 'ghost fishing' caused by lost gear.
Innomar sought to digitize this compliance by deploying smart buoys equipped with GPS and environmental sensors. My role was to build the interface that made this tracking practical for fishermen operating in harsh open-ocean conditions.
Mapbox & SVG Visualization Engine Standard map markers were insufficient for the level of detail required. I engineered a custom visualization layer using Mapbox combined with dynamic SVGs to represent the complex state of the gear.
Drift & Anchoring Visualization: A critical feature was showing the relationship between the buoy's *anchoring position* (where it was dropped) and its *current position* (where it drifted). I used SVG vectors to draw a dynamic tether line between these coordinates, giving captains an immediate visual indication of underwater current drag and potential anchor slippage.
Geofencing & Zones: I implemented a client-side geofencing system using Turf.js. Users could draw polygon zones on the map, and the SVG layer would visually alert them if a buoy drifted outside its designated legal fishing zone—a key compliance feature.
Live Homing UI: To assist in physical retrieval, I built a 'Homing Mode'. This rendered the user's vessel location and heading vector directly on the map in real-time. By projecting the boat's path relative to the drifting buoy, we made it significantly easier for captains to navigate directly to their gear in poor visibility.
Visualizing Aquaculture Installations Beyond individual open-ocean buoys, the platform also had to support large-scale fixed aquaculture installations (fish farms). A simple point marker wasn't enough to represent these massive structures.
I implemented a feature to render the precise physical footprint of these installations using GeoJSON polygons. This allowed us to draw the actual shape of the cages and pens on the map, providing context for the sensor data and helping vessels navigate safely around the physical infrastructure.