.png%3Falt%3Dmedia%26token%3D6961afd0-230e-4214-a812-7e27e27d37a3)
.png%3Falt%3Dmedia%26token%3D6961afd0-230e-4214-a812-7e27e27d37a3)
NavScript
Programmable maps to help you better understand the world
NavScript is Navigate's domain-specific language (DSL) for interacting with Navigate Maps.
With the goal to help you explore map data in a better and easier way than ever before, NavScript provides a simple and intuitive syntax for common map-related tasks such as adding markers, adding geojson, changing the map style, and more.
This is just the initial release of NavScript, so keep an eye out for many new structures and functions in 2023 that will reshape how you interact with the high-resolution, crowdsourced data in Navigate Maps.
The language includes the following data types:
numberfor numeric valuesstringfor textual valuesbooleanfor true/false valuesarrayfor ordered lists of valuesobjectfor collections of key-value pairs
Here is an example usage of different data types in the language:
const a = 5; // number
const b = "hello"; // string
const c = true; // boolean
const d = [1, 2, 3]; // array
const e = { // object
name: "John",
age: 30,
address: {
street: "123 Main St",
city: "Anytown",
state: "CA"
}
};
Coming soon...
Primitive functions are built-in functions that provide basic functionality to the NavScript.
sleep(ms: number) => Promise
The
sleep function is used to pause execution of the script for a given number of milliseconds.Example usage:
sleep(1000); // pause execution for one second
zoom(level: number) => Promise
The
zoom function is used to zoom the map to a specific level. The level argument must be between 0 and 22.Example usage:
zoom(10); // zoom the map to level 10
setStyle(style: string) => Promise
The
setStyle function is used to change the style of the map. The style argument must be a string and can be one of "satellite" or "street".Example usage:
setStyle("satellite"); // change the map style to satellite view
moveLocation(coordinates: [number, number]) => Promise
The
moveLocation function is used to move the map to a specific location. The coordinates argument must be an array of two numbers representing the longitude and latitude of the location.Example usage:
moveLocation([-122.4194, 37.7749]); // move the map to San Francisco
addText(text: string, locationOnMap: [number, number]) => Promise
The
addText function is used to add text to the map at a specific location. The text argument must be a string and the locationOnMap argument must be an array of two numbers representing the longitude and latitude of the location.Example usage:
addText("Hello, World!", [-122.4194, 37.7749]); // add the text "Hello, World!" to San Francisco
rotateTo(bearing: number) => Promise
The
rotateTo function is used to rotate the map to a specific bearing (in degrees).Example usage:
rotateTo(90); // rotate the map 90 degrees clockwise
addGeojson(name: string, geojson: object) => void
The
addGeojson function is used to add a GeoJSON source to the map. The name argument must be a string and the geojson argument must be a valid GeoJSON object.Example usage:
addGeojson("myGeojson", {
type: "FeatureCollection",
features: [
{
type: "Feature",
geometry: {
type: "Point",
coordinates: [-122.4194, 37.7749],
},
properties: {
name: "San Francisco",
},
},
],
}); // add a GeoJSON point feature to the map
removeGeojson(name: string) => void
The
removeGeojson function removes a GeoJSON layer and its associated source from the map. It takes a name argument which is the name of the layer to remove. The name argument must be a string.Example usage:
removeGeojson("myGeojson");
addMarker(coordinates: [number, number], color: string) => void
The
addMarker function adds a marker to the map. It takes two arguments, coordinates and color. The coordinates argument is an array of two numbers representing the longitude and latitude of the marker's position on the map. The color argument is a string representing the color of the marker. The color can be specified as a hex code or as a named color. If the color argument is not provided, the marker will be red by default.Example usage:
// Add a red marker at [-97.73890837139714, 30.433607100113203]
addMarker([-97.73890837139714, 30.433607100113203]);
// Add a blue marker at [-97.73890837139714, 30.433607100113203]
addMarker([-97.73890837139714, 30.433607100113203], "#0000ff");
addVideo(coordinates: [number, number], url: string) => void
The
addVideo function adds a marker to the map that, when clicked, displays a video player with the specified video URL. It takes two arguments, coordinates and url. The coordinates argument is an array of two numbers representing the longitude and latitude of the marker's position on the map. The url argument is a string representing the URL of the video to be played.Example usage:
addVideo([-97.73890837139714, 30.433607100113203], "https://www.youtube.com/watch?v=dQw4w9WgXcQ");
Here is an example of NavScript code:
// Display a marker and move to a location
addMarker([-97.73890837139714, 30.433607100113203], "#FF0000");
moveLocation([-97.74, 30.43]);
sleep(2000);
moveLocation([-97.75, 30.44]);
// Add a video player marker and play a video
addVideo([-97.74, 30.43], "https://www.youtube.com/watch?v=dQw4w9WgXcQ");
// Add a GeoJSON polygon and zoom to fit it on the screen
const polygon = {
"type": "Feature",
"geometry": {
"type": "Polygon",
"coordinates": [[
[-97.735, 30.433],
[-97.735, 30.437],
[-97.73, 30.437],
[-97.73, 30.433],
[-97.735, 30.433]
]]
}
};
addGeojson("polygon", polygon);
sleep(2000);
zoom(12);
sleep(2000);
setStyle("street");
sleep(2000);
removeGeojson("polygon");