🤖 Merge PR DefinitelyTyped#73534 feat(plotly.js): add MapboxBounds, supplement jsdoc for Mapbox by @hkleungai

Author: hkleungai

types/plotly.js/index.d.ts

@@ -195,15 +195,63 @@ export interface MapboxLayers {
     name: string;
     templateitemname: string;
 }
+
+export interface MapboxBounds {
+    /**
+     * Sets the maximum longitude of the map (in degrees East) if `west`, `south` and `north` are declared.
+     */
+    east: number;
+    /**
+     * Sets the maximum latitude of the map (in degrees North) if `east`, `west` and `south` are declared.
+     */
+    north: number;
+    /**
+     * Sets the minimum latitude of the map (in degrees North) if `east`, `west` and `north` are declared.
+     */
+    south: number;
+    /**
+     * Sets the minimum longitude of the map (in degrees East) if `east`, `south` and `north` are declared.
+     */
+    west: number;
+}
+
 export interface Mapbox {
     domain: Partial<Domain>;
+    /**
+     * Sets the mapbox access token to be used for this mapbox map.
+     * Alternatively, the mapbox access token can be set in the configuration options under `mapboxAccessToken`.
+     * Note that accessToken are only required when `style` (e.g with values : basic, streets, outdoors, light, dark, satellite, satellite-streets ) and/or a layout layer references the Mapbox server.
+     */
     accesstoken: string;
+    /**
+     * Defines the map layers that are rendered by default below the trace layers defined in `data`, which are themselves by default rendered below the layers defined in `layout.mapbox.layers`.
+     * These layers can be defined either explicitly as a Mapbox Style object which can contain multiple layer definitions that load data from any public or private Tile Map Service (TMS or XYZ) or Web Map Service (WMS) or implicitly by using one of the built-in style objects which use WMSes which do not require any access tokens, or by using a default Mapbox style or custom Mapbox style URL, both of which require a Mapbox access token.
+     * Note that Mapbox access token can be set in the `accesstoken` attribute or in the `mapboxAccessToken` config option.
+     * Mapbox Style objects are of the form described in the Mapbox GL JS documentation available at https://docs.mapbox.com/mapbox-gl-js/style-spec.
+     * The built-in plotly.js styles objects are: carto-darkmatter, carto-positron, open-street-map, stamen-terrain, stamen-toner, stamen-watercolor, white-bg.
+     * The built-in Mapbox styles are: basic, streets, outdoors, light, dark, satellite, satellite-streets.
+     * Mapbox style URLs are of the form: mapbox://mapbox.mapbox-<name>-<version>
+     */
     style: number | string;
     center: Partial<MapboxCenter>;
+    /**
+     * Sets the zoom level of the map (mapbox.zoom).
+     */
     zoom: number;
+    /**
+     * Sets the bearing angle of the map in degrees counter-clockwise from North (mapbox.bearing).
+     */
     bearing: number;
+    bounds: MapboxBounds;
+    /**
+     * Sets the pitch angle of the map (in degrees, where *0* means perpendicular to the surface of the map) (mapbox.pitch).
+     */
     pitch: number;
     layers: Array<Partial<MapboxLayers>>;
+    /**
+     * Controls persistence of user-driven changes in the view: `center`, `zoom`, `bearing`, `pitch`.
+     * Defaults to `layout.uirevision`.
+     */
     uirevision: number | string;
     uid: string;
 }

types/plotly.js/test/index-tests.ts

@@ -1232,7 +1232,18 @@ function rand() {
 
     const layout: Partial<Layout> = {
         dragmode: "zoom",
-        mapbox: { style: "open-street-map", center: { lat: 0, lon: -0 }, zoom: 3 },
+        mapbox: {
+            accesstoken: "accesstoken",
+            domain: { x: [0], y: [0], row: 0, column: 0 },
+            style: "open-street-map",
+            center: { lat: 0, lon: -0 },
+            zoom: 3,
+            bearing: 30,
+            bounds: { east: 0, west: 0, south: 0, north: 0 },
+            pitch: 0,
+            layers: [],
+            uirevision: "uirevision",
+        },
         margin: { r: 0, t: 0, b: 0, l: 0 },
     };
 

types/plotly.js/v2/index.d.ts

@@ -195,15 +195,63 @@ export interface MapboxLayers {
     name: string;
     templateitemname: string;
 }
+
+export interface MapboxBounds {
+    /**
+     * Sets the maximum longitude of the map (in degrees East) if `west`, `south` and `north` are declared.
+     */
+    east: number;
+    /**
+     * Sets the maximum latitude of the map (in degrees North) if `east`, `west` and `south` are declared.
+     */
+    north: number;
+    /**
+     * Sets the minimum latitude of the map (in degrees North) if `east`, `west` and `north` are declared.
+     */
+    south: number;
+    /**
+     * Sets the minimum longitude of the map (in degrees East) if `east`, `south` and `north` are declared.
+     */
+    west: number;
+}
+
 export interface Mapbox {
     domain: Partial<Domain>;
+    /**
+     * Sets the mapbox access token to be used for this mapbox map.
+     * Alternatively, the mapbox access token can be set in the configuration options under `mapboxAccessToken`.
+     * Note that accessToken are only required when `style` (e.g with values : basic, streets, outdoors, light, dark, satellite, satellite-streets ) and/or a layout layer references the Mapbox server.
+     */
     accesstoken: string;
+    /**
+     * Defines the map layers that are rendered by default below the trace layers defined in `data`, which are themselves by default rendered below the layers defined in `layout.mapbox.layers`.
+     * These layers can be defined either explicitly as a Mapbox Style object which can contain multiple layer definitions that load data from any public or private Tile Map Service (TMS or XYZ) or Web Map Service (WMS) or implicitly by using one of the built-in style objects which use WMSes which do not require any access tokens, or by using a default Mapbox style or custom Mapbox style URL, both of which require a Mapbox access token.
+     * Note that Mapbox access token can be set in the `accesstoken` attribute or in the `mapboxAccessToken` config option.
+     * Mapbox Style objects are of the form described in the Mapbox GL JS documentation available at https://docs.mapbox.com/mapbox-gl-js/style-spec.
+     * The built-in plotly.js styles objects are: carto-darkmatter, carto-positron, open-street-map, stamen-terrain, stamen-toner, stamen-watercolor, white-bg.
+     * The built-in Mapbox styles are: basic, streets, outdoors, light, dark, satellite, satellite-streets.
+     * Mapbox style URLs are of the form: mapbox://mapbox.mapbox-<name>-<version>
+     */
     style: number | string;
     center: Partial<MapboxCenter>;
+    /**
+     * Sets the zoom level of the map (mapbox.zoom).
+     */
     zoom: number;
+    /**
+     * Sets the bearing angle of the map in degrees counter-clockwise from North (mapbox.bearing).
+     */
     bearing: number;
+    bounds: MapboxBounds;
+    /**
+     * Sets the pitch angle of the map (in degrees, where *0* means perpendicular to the surface of the map) (mapbox.pitch).
+     */
     pitch: number;
     layers: Array<Partial<MapboxLayers>>;
+    /**
+     * Controls persistence of user-driven changes in the view: `center`, `zoom`, `bearing`, `pitch`.
+     * Defaults to `layout.uirevision`.
+     */
     uirevision: number | string;
     uid: string;
 }

types/plotly.js/v2/test/index-tests.ts

@@ -1237,7 +1237,18 @@ function rand() {
 
     const layout: Partial<Layout> = {
         dragmode: "zoom",
-        mapbox: { style: "open-street-map", center: { lat: 0, lon: -0 }, zoom: 3 },
+        mapbox: {
+            accesstoken: "accesstoken",
+            domain: { x: [0], y: [0], row: 0, column: 0 },
+            style: "open-street-map",
+            center: { lat: 0, lon: -0 },
+            zoom: 3,
+            bearing: 30,
+            bounds: { east: 0, west: 0, south: 0, north: 0 },
+            pitch: 0,
+            layers: [],
+            uirevision: "uirevision",
+        },
         margin: { r: 0, t: 0, b: 0, l: 0 },
     };