added comments and fixed centering (8a8eb87e) · Commits · aflab / astrogeology / Asc Geostac

app/src/js/AstroMap.js

+11 −1

Original line number	Diff line number	Diff line
		@@ -172,7 +172,7 @@ export default L.Map.AstroMap = L.Map.extend({
		// at such a high zoom level.
		this.setView(center, 1, true);
		}

		this.options.center = center;
		let newCRS = null;
		if (name == "cylindrical") {
		newCRS = this._defaultProj;
		@@ -266,5 +266,15 @@ export default L.Map.AstroMap = L.Map.extend({
		*/
		radii: function() {
		return this._radii;
		},

		/**
		* @function AstroMap.prototype.getCenter
		* @description getter method to access the center of the map.
		*
		* @return {LatLng} The center coordinates of the map.
		*/
		getCenter: function() {
		return this.options.center;
		}
		});

app/src/js/ViewCenterControl.js

+27 −9

Original line number	Diff line number	Diff line
		import L from "leaflet";

		/**
		* @class ViewCenterControl
		* @aka L.Control.ViewCenterControl
		* @inherits L.Control
		*
		* @classdesc Control that allows users to reposition the map to the center while maintaining current zoom level.
		*/
		export default L.Control.ViewCenter = L.Control.extend({
		options: {
		position: "topleft"
		},

		initialize: function(map) {
		this._centerLatLng = [0, 0];
		},

		/**
		* @function ViewCenterControl.prototype.onAdd
		* @description Creates new container holding the ViewCenter button
		* @param {AstroMap} map - The map to add the control to.
		* @return {Div} Container containing the ViewCenter button.
		*/
		onAdd: function(map) {
		let container = L.DomUtil.create("div", "leaflet-bar");
		let className = "leaflet-control-view-center";

		this._createButton(className, container, this.setCenterView, map);
		this._createButton(className, container, map);

		return container;
		},
		_createButton: function(className, container, fn, map) {

		/**
		* @function ViewCenterControl.prototype._createButton
		* @description Creates new link element inside the ViewCenter container and provides onclick functionality to reposition the map view to the map's center based on its current projection.
		* @param {String} className - The name of the element's class.
		* @param {Div} container - The container object to put the element into.
		* @param {AstroMap} map - The map to add the control to.
		* @return {Link} Element containing the ViewCenter link.
		*/
		_createButton: function(className, container, map) {
		let link = L.DomUtil.create("a", className, container);
		link.href = "#";
		link.title = "Center map";
		L.DomEvent //.on(link, "click", L.DomEvent.stopPropagation)
		//.on(link, "click", L.DomEvent.preventDefault)
		L.DomEvent.on(link, "click", L.DomEvent.stopPropagation)
		.on(link, "click", L.DomEvent.preventDefault)
		.on(
		link,
		"click",
		function() {
		map.setView([0, 0], map.getZoom());
		map.setView(map.getCenter(), map.getZoom());
		},
		map
		);