Use react load of astrowebmaps in Leaflet map (fa221a29) · Commits · aflab / astrogeology / Asc Geostac

src/components/container/App.jsx

+3 −0

Original line number	Original line	Diff line number	Diff line
	@@ -128,6 +128,9 @@ export default function App() {
	"name" : target.name,		"name" : target.name,
	"naif" : target.naif,		"naif" : target.naif,
	"hasFootprints" : hasFootprints,		"hasFootprints" : hasFootprints,
			"aaxisradius": target.aaxisradius,
			"baxisradius": target.baxisradius,
			"caxisradius":target.caxisradius,
	"layers" : {		"layers" : {
	"base" : [],		"base" : [],
	"overlays" : [],		"overlays" : [],

src/components/container/GeoStacApp.jsx

+2 −1

Original line number	Original line	Diff line number	Diff line
	@@ -29,6 +29,7 @@ let css = {
	* @component		* @component
	*/		*/
	export default function GeoStacApp(props) {		export default function GeoStacApp(props) {
			console.log(props);
	const [targetPlanet, setTargetPlanet] = React.useState("Mars");		const [targetPlanet, setTargetPlanet] = React.useState("Mars");

	const [footprintData, setFootprintData] = React.useState([]);		const [footprintData, setFootprintData] = React.useState([]);
	@@ -68,7 +69,7 @@ export default function GeoStacApp(props) {
	bodyChange={handleTargetBodyChange}		bodyChange={handleTargetBodyChange}
	/>		/>
	<div id="map-area">		<div id="map-area">
	<MapContainer target={targetPlanet} />		<MapContainer target={targetPlanet} mapList={props.mapList} />
	</div>		</div>
	<QueryConsole />		<QueryConsole />
	</div>		</div>

src/components/container/MapContainer.jsx

+3 −3

Original line number	Original line	Diff line number	Diff line
	@@ -20,7 +20,7 @@ export default function MapContainer(props) {
	* handles all of the map intialization and creation.		* handles all of the map intialization and creation.
	*/		*/
	useEffect( () => {		useEffect( () => {
	let map = new AstroMap("map-container", props.target, {});		let map = new AstroMap("map-container", props.target, props.mapList, {});
	let controlManager = new AstroControlManager(map);		let controlManager = new AstroControlManager(map);
	controlManager.addTo(map);		controlManager.addTo(map);
	setOldTarget(props.target)		setOldTarget(props.target)
	@@ -48,7 +48,7 @@ export default function MapContainer(props) {
	document.getElementById("projectionSouthPole").classList.remove("disabled");		document.getElementById("projectionSouthPole").classList.remove("disabled");

	// create new map with updated target		// create new map with updated target
	let map = new AstroMap("map-container", props.target, {});		let map = new AstroMap("map-container", props.target, props.mapList,{});
	let controlManager = new AstroControlManager(map);		let controlManager = new AstroControlManager(map);
	controlManager.addTo(map);		controlManager.addTo(map);
	setOldTarget(props.target)		setOldTarget(props.target)

src/js/AstroMap.js

+17 −32

Original line number	Original line	Diff line number	Diff line
	@@ -43,7 +43,8 @@ export default L.Map.AstroMap = L.Map.extend({
	zoomControl: false		zoomControl: false
	},		},

	initialize: function(mapDiv, target, options) {		initialize: function(mapDiv, target, mapList, options) {
			this._mapList = mapList
	this._mapDiv = mapDiv;		this._mapDiv = mapDiv;
	this._target = target;		this._target = target;
	this._astroProj = new AstroProj();		this._astroProj = new AstroProj();
	@@ -216,37 +217,21 @@ export default L.Map.AstroMap = L.Map.extend({
	wfs: []		wfs: []
	};		};

	let targets = MY_JSON_MAPS["targets"];		let systems = this._mapList["systems"];
			for(let x = 0; x < systems.length; x++){
			let targets = systems[x].bodies

	for (let i = 0; i < targets.length; i++) {		for (let i = 0; i < targets.length; i++) {
	let currentTarget = targets[i];		let currentTarget = targets[i];

	if (currentTarget["name"].toLowerCase() == this._target.toLowerCase()) {		if (currentTarget["name"].toLowerCase() == this._target.toLowerCase()) {
	this._radii["a"] = parseFloat(currentTarget["aaxisradius"] * 1000);		this._radii["a"] = parseFloat(currentTarget["aaxisradius"] * 1000);
	this._radii["c"] = parseFloat(currentTarget["caxisradius"] * 1000);		this._radii["c"] = parseFloat(currentTarget["caxisradius"] * 1000);
	let jsonLayers = currentTarget["webmap"];		let jsonLayers = currentTarget.layers;
	for (let j = 0; j < jsonLayers.length; j++) {		console.log(jsonLayers['base']);
	let currentLayer = jsonLayers[j];		for (let key of Object.keys(jsonLayers)){
	if (		layers[key] =jsonLayers[key].filter(function(currentLayer){
	currentLayer["projection"].toLowerCase() != projection.toLowerCase()		return currentLayer["projection"].toLowerCase() == projection.toLowerCase();
	) {		});
	continue;
	}
	if (currentLayer["type"] == "WMS") {
	// Base layer check
	if (currentLayer["transparent"] == "false") {
	layers["base"].push(currentLayer);
	} else {
	// Do not add "Show Feature Names" PNG layer.
	if (currentLayer["displayname"] != "Show Feature Names") {
	layers["overlays"].push(currentLayer);
	} else {
	if(currentLayer["layer"] == "NOMENCLATURE"){
	layers["nomenclature"].push(currentLayer);
	}
	}
	}
	} else {
	layers["wfs"].push(currentLayer);
	}		}
	}		}
	}		}