Home Cases Engineering & Construction NeptunusDetect

NeptunusDetect

A water loss and leak detection app that helps users find and locate leaks, even small or hard-to-detect ones, anywhere in the water system

Technologies

Rails 7, React, Leaflet, gcoord, Docker, Ansible

Industry

Engineering & Construction

Engagement Model

Custom Software Development

Platform

Web

Team

7 members

Timeline

2.5 months

Overview

The client company, NeptunusDetect, is a global technology leader and innovator in intelligent water loss and leak detection technologies.

It’s a third-generation privately owned enterprise with headquarters in Baar, Switzerland, and regional offices in Europe, North and Latin America, the Middle East, Southeast Asia, and Australia.

They needed to adapt their leak detection app for the Chinese market to fit its special coordinate system standards.

The company decided to enter the Chinese market but faced significant challenges right away.

When their Chinese distributors placed some sensors, they found them located in a river. This was a major issue. Another problem was legal — to use map navigation software in China, the software and the company must be registered in China.

Project challenges

NeptunusDetect’s previous pipeline monitoring app faced several notable challenges:

Dependence on Google Maps: The app’s reliance on Google Maps raised concerns, as heavy usage could potentially lead to restrictions by Chinese authorities.
User Experience Issues: The app’s limited data visualization and accessibility made it challenging for users to monitor water pipe incidents and review historical data.
Localization Gaps: The app’s lack of adequate support for the Chinese language reduced its usability for local users.
Another obvious challenge was the Golden Shield Project, often called the “great firewall of China”, an initiative managed by the Ministry of Public Security division of the Chinese government. It monitors and censors what can and cannot be seen through an online network in China. Access to popular services is limited, and traffic latency is very high, so the client needed a server in the country.

The client approached us to help solve these problems.

Our Work

Our work with them included two stages: the Proof of Concept (PoC) and the Minimum Viable Product (MVP). In the PoC stage, we integrated the client’s API to test its compatibility with Chinese map providers.

Later on, we built a system that allowed the client to switch between different map providers easily. This let us pull data from the client’s app and it was important for the client because each map provider displayed cities and towns differently.

For example, one provider might show a small town in a location, while another might show a waste lot or land property.

The prices of these providers also varied. At first, the client chose the free option with Open Street Map, but later, we switched to Baidu Map to better fit their needs.

Overview of Chinese Providers

So, our first objective was to review Chinese map providers. We were looking for a solution that would comply with legal requirements and ensure that the data was highly accurate and up to date.

We needed to choose the right map provider to adapt our app to the Chinese market. Each provider has its own features and challenges, so this choice was important for a further smooth transition into the Chinese geolocation environment.

We focused on several main Chinese map providers:

Gaode (Amap): Offers detailed and extensive coverage of China.
Tencent Maps: Provides unique mapping solutions popular in local apps.
GeoQ: Great for visualization and analytical tasks.
Baidu Map: One of the most popular maps in China, known for accuracy and updates.
The Chinese version of Google Maps: Adapted to meet local legal rules.
OpenStreetMap: An open-source map data used in the Chinese market.

And others.

We chose a combination of Leaflet and React libraries to combine map providers in a single application and compare them without dealing with each provider’s APIs.

Leaflet is a lightweight but powerful library for creating interactive maps, while React is ideal for building dynamic user interfaces.

We used the Leaflet.ChineseTmsProviders repository to simplify the integration of various Chinese map providers.

This tool provided us with ready-made configurations for various Chinese map providers, significantly speeding up the map development and integration process. It also allowed us to test about eight map providers quickly.

Solving the Data Mismatch Mystery

After carefully setting up the app using Chinese map providers, we were convinced that everything would work perfectly.

But the reality was different. The data coming from the clients was still displayed incorrectly. So, we needed to find out what had gone wrong. The answer was in the coordinates system.

As it turned out, China has its unique coordinate system standards and map datum.

An international standard is WGS-84 (Earth coordinates) or World Geodetic System, where 84 is the latest revision of this standard applied in 1984.

Chinese regulators require approved map services to use standard GCJ-02.

GCJ-02 is based on WGS-84 and uses an obfuscation algorithm, adding random offsets to the latitude and longitude to improve national security. If the WGS-84 point is placed on the GCJ-02 map, the average location offset will be about 300-500m.

Baidu, one of the licensed base maps in China, implemented yet another abstraction, adding further obfuscation to GCJ-02.

It’s called BD-09 (Baidu, formulated in 2009). The primary purpose was to protect Baidu’s data so competitors couldn’t easily duplicate it. Baidu has internal tools to shift between the three coordinate systems, but it only made GCJ-02 to BD-09 public to encourage using their standard for tiles, search coordinates, etc.

Gcoord Library

To solve this problem, we used the gcoord library, which provides a simple and efficient way to convert coordinates between different systems.

This solution allowed us to adapt the data from the clients to the unique Chinese coordinate systems, thus ensuring an accurate and correct display of geospatial information in the app.

Key improvements

The JetRuby team has developed a Minimum Viable Product (MVP) that leverages advanced technology and a user-friendly design to tackle key challenges:

China Cloud Service with Map Switching: A local OpenStreetMap (OSM) server reduces censorship risks and allows easy switching between OSM and Baidu Maps.
User Interface & Data Tables: The login page has been redesigned for better reliability, and new interactive data tables enhance search and sorting with the client’s APIs.

Real-Time Pipeline Visualization: Pipeline overlays on maps update in real time based on project IDs, making navigation easier.
Water Incidents Tracking & Historical Data: Users can track water pipe events and filter past data with a date picker for better monitoring and decision-making.
Language and Usability: English and Chinese interfaces with an easy language switch, plus hover-over map icons for quick info on events and locations.

Business outcomes

Our team developed NeptunusDetect’s MVP, which offered a simple and flexible solution that met China’s specific rules and needs.

Here are the main benefits:

A strong map-switching feature kept services running, even when regulations could change.

Users could see real-time data and past information, which made managing pipelines more efficient.

Upgrades in language and design provided a smooth experience for both English and Chinese speakers.

JetRuby helped NeptunusDetect develop an MVP, paving the way for better pipeline management around the world.

We’ve once again proved that success on a global scale requires adaptability and continuous learning. This project reinforced the value of flexible thinking, openness to new ideas, and strong teamwork.

We hope that our experience will serve as a useful lesson and inspiration for other developers seeking to overcome borders and adapt their products for a global audience.