Labels

Overview

In this exercises we'll look at labelling features in a map. We'll be using a lakes dataset from the original Itasca County, Minnesota MapServer demo.

Labels

LABELs are placed within a CLASS. Each class can label features differently.

Here is the LABEL block used in our example:

LABEL
    COLOR 255 255 255
    TEXT (initcap("[LAKE_NAME]"))
    TYPE TRUETYPE 
    FONT LiberationMono
    SIZE 12
    PARTIALS FALSE
    POSITION CC
    FORCE TRUE
    ANGLE FOLLOW
END

Label Positions

We use the centerline function as part of a GEOMTRANSFORM expression:

GEOMTRANSFORM (centerline(densify([shape], 0.1)))

Code

Example

• Direct MapServer request: http://localhost:5000/?map=/etc/mapserver/lakes.map&mode=map&layer=lakes&layer=lake-labels
• Local OpenLayers example: http://localhost:5001/lakes.html

Javascript

import '../css/style.css';
import ImageWMS from 'ol/source/ImageWMS.js';
import Map from 'ol/Map.js';
import OSM from 'ol/source/OSM.js';
import View from 'ol/View.js';
import { Image as ImageLayer, Tile as TileLayer } from 'ol/layer.js';

const mapserverUrl = import.meta.env.VITE_MAPSERVER_BASE_URL;
const mapfilesPath = import.meta.env.VITE_MAPFILES_PATH;

const layers = [
    new TileLayer({
        source: new OSM(),
        visible: false
    }),
    new ImageLayer({
        //extent: [-10511673.608284535, 5945083.891031924, -10359446.890274443, 6088408.054427299],
        source: new ImageWMS({
            url: mapserverUrl + mapfilesPath + 'lakes.map&',
            params: { 'LAYERS': 'lakes,lake-labels', 'STYLES': '' },
            ratio: 1
        }),
    }),
];

const map = new Map({
    layers: layers,
    target: 'map',
    view: new View({
        center: [-10405560, 6011045],
        zoom: 11,
    }),
});

Mapfile

MAP
    NAME "ItascaLakes"
    EXTENT 393234.3937012631 5208170.531190613 495403.1713263091 5303964.876754144
    SIZE 800 600
    PROJECTION
        "init=epsg:26915"
    END
    FONTSET "data/fonts/fontset.txt"    
    WEB
        METADATA
            "ows_enable_request" "*" 
            "ows_srs" "EPSG:4326 EPSG:3857" 
        END
    END
    LAYER
        NAME "lakes"
        STATUS OFF
        TYPE POLYGON
        CONNECTIONTYPE OGR
        CONNECTION "data/itasca/lakespy2.shp"
        PROCESSING "NATIVE_FILTER=LAKE_NAME!=''"
        CLASS
            NAME "Lakes & Rivers"
            STYLE
                COLOR 49 117 185
            END
        END
    END
    LAYER
        NAME "lake-labels"
        STATUS OFF
        TYPE LINE
        CONNECTIONTYPE OGR
        CONNECTION "data/itasca/lakespy2.shp"
        GEOMTRANSFORM (centerline([shape]))
        # workaround for https://github.com/MapServer/MapServer/issues/7058
        PROCESSING "NATIVE_FILTER=FID NOT IN (127, 1112)"
        CLASS
            LABEL
                COLOR 255 255 255
                TEXT (initcap("[LAKE_NAME]"))
                TYPE TRUETYPE 
                FONT LiberationMono
                SIZE 12
                PARTIALS FALSE
                POSITION CC
                FORCE TRUE
                ANGLE FOLLOW
            END
        END
    END
END

Exercises

1. Use a different font for the label by adding the following to the LABEL block: FONT MonsieurLaDoulaise and increasing the SIZE to 28.
2. Comment out the GEOMTRANSFORM (centerline([shape])) and ANGLE FOLLOW lines (using #) to see its effect on the map.