Added Route Registration Feature to the "Rekichizu x Next.js" Site

Overview

I added a route registration feature to the “Rekichizu x Next.js” site. Below is a display example.

References

The “Rekichizu x Next.js” site is introduced in the following article.

As a precedent for displaying routes using “Rekichizu”, the following example exists.

https://codh.rois.ac.jp/edomi/route/

This time, I added a route creation feature based on the above example.

Usage

Access the site.

https://rekichizu-next.vercel.app/ja/

Click “Manage My Routes”.

Login is required, so log in using the button in the upper right.

Create a route from “Create New Route”.

Below is the edit screen.

Clicking the edit icon allows you to edit the route title and description.

Setting the mode to “Add” will place a pin at the location you click on the map. You can also move pins by drag and drop.

Markers can be reordered by drag and drop.

Import and Export

Export

Download buttons are placed on the route list screen and the edit screen. A JSON file like the following is downloaded.

When pasted into geojson.io, it displays as follows.

Import

Let’s try importing the GeoJSON created in the following article.

Specifically, the following file.

https://nakamura196.github.io/peripleo/data/VisitPlus-UK.lp.json

This JSON file does not contain LineString type data and the metadata fields do not fully correspond, so the results are incomplete. However, you can confirm that Point type markers are imported.

Future Tasks

Metadata Schema Configuration

Since the metadata fields to record vary by project, we plan to make it possible to change the metadata schema for each route.

CSV File Import Feature

When registering large amounts of data at once, it is common to create data using spreadsheet software like CSV or Excel. Inspired by the tabular visualization in geojson.io, the following format could be considered.

Summary

This is an application that may change from time to time, but I hope it serves as a helpful reference.