signalk-collision-detection

Signalk web application for assessing the risk of potential collisions for a vessel.

Introduction

The aim of this plugin is to enable a user of the signalk platform to receive potential risks of collision from the server. The plugin interfaces with the signalk data model to obtain relevant information that is exposed of the own vessel and others identified by sensors and receivers like AIS.

Theory overview

The plugin represents the current vessel and nearby vessels as points, which are a pair of longitude and latitude values representing a unique location. Using Closest Point of Approach(CPA) algorithm all nearby vessels will be evaluated to determine a particular risk assessment TBD.

Software Design Overview

In this repository two examples are provided ClientCore and SignalkCore. These serve as interfaces to a core service like signalk which enable methods or endpoints that provide sensor information that is relevant or required by the higher level algorithms which interface with only methods exposed by the core interface API. This enables easier portability and platform independency.

Project Structure

Has to be updated

.
├── examples
├── LICENSE
├── node_modules
├── package-lock.json
├── package.json
├── public_src # Template directory for HTML and css rendering
│   └── index.html
├── README.md
├── src # Source files for plugin and webapp frontend content
│   ├── components
│   │   └── AppPanel.js
│   └── index.js # Plugin related content
│   └── bootstrap.js # Used to render the frontend on client-side
└── webpack.config.js # Webpack configurations

Build Instructions

package manager

TBD

Source

If you wish to install and develop on top of this project you may wish to build from source. First you need to clone the repository on your local machine. This can be done by the following command:

git clone git@github.com:matas-noreika/signalk-collision-detection.git

In order to view the package you must use a npm symlink it can be done by the following:

npm link # run this in the project directory
cd ~/.signalk # cd to signalk server
npm link signalk-collision-detection # adds symlink to project directory

The project has to be bundled and transpiled which can be done using two available commands: npm run build or npm run dev. Dev generates a local testable copy not suitable for sharing.

Once bundled you will find a public/ directory from which you can open the index.html to view the AppPanel component. MacOS users may use open index.html

Next Steps

• Configure plugin to integrate as embeddable webapp
• Configure webapp frontend to enable user to interface with plugin API
• Implement vessel position injector for testing purposes
• Implement a ownvessel update mechanic from the plugin configuration menu enable generic movement patterns: straight line, circle, etc.
• Implement CPA algorithm
• TBD

Dev notes

• The web app uses webpack for bundling and transpiling to ES5.
• The frontend framework uses react as per the documentation provided on signalk.
• Signalk-server expects a file names remoteEntry.js for webapp frontend.
• signalk-server expects react and react-dom as shared libraries under the exposed module federation using {singleton: true, requiredVersion: false}.

If you are using not sensors to update self position use the following json data in data fiddler to write some latitude and longitude information.

{
  "context": "vessels.self",
  "updates": [
    {
      "source": { "label": "GPS_1" },
      "timestamp": "2026-03-05T12:00:00.000Z",
      "values": [
        { "path": "navigation.position", "value": { "longitude": 123.456, "latitude": 65.432 } },
        { "path": "navigation.speedOverGround", "value": 5.2 }
      ]
    }
  ]
}

AppPanel client and server preview

At the time of developing this repository the resources and documentation regarding embeddable webapps on signalk is very poor. I have accomplished a nice feature that may enable other developers to render their components regardless of if they are on the signalk server or rendering from the index.html source. This can be particularly useful if a developer wishes to create a portable codebase which can also seamlessly be integrated with signalk. This is still a topic to explore but has a great potential in the available options not only limited to signalk.

Originally I experienced difficultly due to eager consumption. This is when an asynchronously loaded module loads before the shared dependencies like react.

webpack solution Using the solution provided on the webpack documentation I was able to load the contents using an index.html generated by the HTMLPlugin from webpack.

Documentation

React Legacy API Signalk documentation