GIS Viewer

GIS Viewer on the Web

GIS vector data is rendered directly in the browser via OpenLayers — supporting layer toggle, attribute inspection, and per-layer styling.

View Live Demo ↓

Core Technologies

OpenLayers

Open-source map library — high-performance vector rendering in the browser.

WebGL

Hardware-accelerated rendering for vector maps with large feature counts.

OGC Standards

Compliant with OGC standards for geometry, CRS, and spatial data formats.

Browser Capabilities

Layer Toggle

Select which layers to render — parcels, roads, boundaries, hydrology.

Attribute Inspector

Click on polygons/lines to view attributes — area, parcel ID, land type.

Layer Styling

Customize colors per layer and control rendering order.

Live Demo

viewer.js

import Map from 'ol/Map';
import View from 'ol/View';
import VectorLayer from 'ol/layer/Vector';
import VectorSource from 'ol/source/Vector';
import GeoJSON from 'ol/format/GeoJSON';

const map = new Map({
  target: 'map-container',
  view: new View({ center: [0, 0], zoom: 12 })
});

// Add vector layer
const layer = new VectorLayer({
  source: new VectorSource({
    url: '/api/v1/gis/parcels.geojson',
    format: new GeoJSON()
  }),
  style: {
    'fill-color': 'rgba(62, 166, 255, 0.15)',
    'stroke-color': '#7cc9ff',
    'stroke-width': 1.5
  }
});
map.addLayer(layer);

// Show attributes on click
map.on('click', (e) => {
  const features = map.getFeaturesAtPixel(e.pixel);
  if (features.length) showPopup(features[0].getProperties());
});

Rotate, zoom, and interact with the model directly in the browser via WebGL.

Features

Client-side vector GIS rendering (no tile server required)

Layer toggle for individual map layers

Attribute inspection on click (popup)

Per-layer color customization

Orthophoto base map support (.mbtiles)

Complex geometry support (MultiCurve, CompoundCurve)

Supported Formats

Vector GIS Orthophoto GeoJSON

Use Cases

Publish as-built or planning map layers to the web viewer.

Access GIS data via browser instead of desktop software.

Render cadastral or boundary maps on OpenLayers.

Overlay GIS vector data with BIM/3D models in a unified project.

FAQ

No. Vector GIS is rendered client-side using OpenLayers. No GeoServer or MapServer needed.

Yes. Orthophoto (.mbtiles) can be used as a base map layer, combined with vector overlays.

Point, LineString, Polygon, MultiCurve, CompoundCurve, and complex OGC-compliant geometries.

Learn More About TSVIDEV

Visit the homepage to explore projects and the latest features.

Go to TSVIDEV Home