SuperMap iClient JavaScript Documentation

SuperMap iClient JavaScript is an open-source WebGIS client application development kit built on modern Web technologies. It serves as a common JavaScript client for SuperMap Cloud GIS and Online GIS platform products.

Key capabilities include:

• Library Integration: Integrates leading open-source map and visualization libraries (such as Leaflet, MapboxGL, MapLibreGL, and OpenLayers).
• Data Support: Supports multi-source data services and map services.
• Cross-Platform: Supports multiple terminals and cross-browser compatibility.
• Advanced Visualization: Provides specialized functions for large-scale data visualization and real-time flow data visualization in GIS environments.

The FeatureService methods return a serviceResult object. The most important part for Mapbox GL JS users is result.features, which is a standard GeoJSON FeatureCollection that can be passed directly to map.addSource().

Structure:

{
    result: {
        features: {
            type: "FeatureCollection",
            features: [...]  // GeoJSON Feature[]
        },
        datasetInfo: {
            name: string,
            dataSourceName: string,
            type: string,
            prjCoordSys: {...},
            bounds: {...}
        }
    }
}

When writing code for SuperMap iClient for MapboxGL, ensure you use the correct namespace to distinguish between iClient-specific extensions and native Mapbox GL JS methods:

• iClient API: Use mapboxgl.supermap (e.g., mapboxgl.supermap.initMap, mapboxgl.supermap.FeatureService).
• Native Mapbox GL JS: Use map. (e.g., map.flyTo(), map.setCenter(), map.addSource()).

It is important to choose the correct service based on your data source and target:

When working with SuperMap iServer WMTS services, ensure your URLs follow these rules:

• Identification: The URL must contain the string WMTS or wmts (case-insensitive).
• Path Structure: iServer WMTS services do not use the /rest/maps/ path. Instead, use the direct service path format: /iserver/services/{wmtsServiceName}.
• Example Format: https://{host}:{port}/iserver/services/{wmtsServiceName}

The QueryService returns a serviceResult object. Unlike FeatureService (which returns a direct GeoJSON FeatureCollection), QueryService results are nested within a recordsets array.

To use the results directly with Mapbox GL map.addSource(), you must access the features via serviceResult.result.recordsets[0].features.

serviceResult Structure

{
    result: {
        currentCount: number, // Number of features in current response
        totalCount: number,   // Total number of features matching criteria
        recordsets: [
            {
                features: [...],  // GeoJSON FeatureCollection
                datasetName: string,
                dataSourceName: string
            }
        ]
    }
}

var features = serviceResult.result.recordsets[0].features;
// features is a GeoJSON FeatureCollection object

When choosing between QueryService and FeatureService in the Mapbox GL module, consider the following differences:

When working with SuperMap iClient JavaScript and MapboxGL, ensure your data layers match the required coordinate systems to avoid overlay errors:

Key Defaults:

• The default Base Map projection is Web Mercator (EPSG:3857).
• GeoJSON data must always be WGS84 (EPSG:4326).

GeoJSON must use the WGS84 (EPSG:4326) coordinate system.

GeoJSON specifications require coordinates to be represented as WGS84 longitude and latitude pairs: [longitude, latitude]. If your data uses other coordinate systems (such as EPSG:3857), you must convert it to WGS84 before overlaying it on the map.