MediaWiki:DataMaps.js

From Deez Nuts' Sword Coast Campaign
Revision as of 18:56, 29 August 2026 by Wvaske (talk | contribs) (Site gadget for the interactive maps: permanent name labels beside every marker)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to navigation Jump to search

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
/**
 * Interactive maps (Extension:DataMaps) site script.
 * Binds a permanent name label to every marker so the maps read like the printed ones.
 * Styling lives in MediaWiki:DataMaps.css (.dn-map-label).
 */
mw.loader.using( 'ext.datamaps.bootstrap' ).then( function () {
	mw.dataMaps.registerMapAddedHandler( function ( map ) {
		var isMini = map.rootElement.classList.contains( 'ext-datamaps-mini-layout' );

		map.on( 'markerReady', function ( marker ) {
			var state = marker.apiInstance && marker.apiInstance[ 2 ],
				size, offsetX;
			if ( !state || !state.label || typeof marker.bindTooltip !== 'function' ) {
				return;
			}
			// Sit the label just right of the icon (icons are anchored at their centre).
			size = marker.options && marker.options.icon && marker.options.icon.options.iconSize;
			offsetX = size ? ( Array.isArray( size ) ? size[ 0 ] : size.x || 40 ) / 2 + 2 : 12;
			marker.bindTooltip( state.label, {
				permanent: true,
				direction: 'right',
				offset: [ offsetX, 0 ],
				interactive: false,
				opacity: 1,
				className: 'dn-map-label' + ( isMini ? ' dn-map-label-mini' : '' )
			} );
		} );
	} );
} );