More robust access and management of viewState

SymbolixAU · May 20, 2024 · 1ac4f0f · 1ac4f0f
1 parent 8619ad4
commit 1ac4f0f
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 24 deletions.
diff --git a/inst/htmlwidgets/mapdeck.js b/inst/htmlwidgets/mapdeck.js
@@ -83,7 +83,7 @@ HTMLWidgets.widget({
        	 	  	}) ],
        	 	  map: false,
 			      container: el.id,
-			      initialViewState: window[el.id + 'INITIAL_VIEW_STATE'],
+			      viewState: window[el.id + 'INITIAL_VIEW_STATE'],
 			      layers: [],
 			      controller: true
 			      //onLayerHover: setTooltip
@@ -140,6 +140,7 @@ HTMLWidgets.widget({
   						if (!HTMLWidgets.shinyMode ) { return; }
 
 						  Shiny.onInputChange(el.id + '_view_change', viewState);
+						  deckgl.setProps({ viewState })
 			      },
 
 			      onDragStart(info, event){

diff --git a/inst/htmlwidgets/mapdeck_location.js b/inst/htmlwidgets/mapdeck_location.js
@@ -6,41 +6,43 @@ function md_change_location( map_id, map_type, location, zoom, pitch, bearing, d
 	var currentMinZoom;
 	var currentMaxPitch;
 	var currentMinPitch;
+	var currentViewState;
 
   if( map_type == "google_map" ) {
   	//console.log( location );
   	window[map_id + 'map'].setCenter( { lat: location[1], lng: location[0] } );
   	window[map_id + 'map'].setZoom( zoom );
   } else {
 
-  	console.log( window[ map_id + 'map' ].viewState.longitude );
-
-	  if ( window[ map_id + 'map'].viewState["default-view"] !== undefined ) {
-	  	currentLon = (location === null || location.length == 0) ? window[ map_id + 'map'].viewState["default-view"].longitude : location[0];
-	  	currentLat = (location === null || location.length == 0) ? window[ map_id + 'map'].viewState["default-view"].latitude : location[1];
-	    currentPitch = pitch === null ? window[ map_id + 'map'].viewState["default-view"].pitch : pitch;
-	    currentBearing = bearing === null ? window[ map_id + 'map' ].viewState["default-view"].bearing : bearing;
-	    currentZoom = zoom === null ? window[ map_id + 'map'].viewState["default-view"].zoom : zoom;
-	    currentMaxZoom = window[ map_id + 'map'].viewState["default-view"].maxZoom;
-	    currentMinZoom = window[ map_id + 'map'].viewState["default-view"].minZoom;
-	    currentMaxPitch = window[ map_id + 'map'].viewState["default-view"].maxPitch;
-	    currentMinPitch = window[ map_id + 'map'].viewState["default-view"].minPitch;
+  	console.log( window[ map_id + 'map' ].viewManager.viewState.longitude );
+
+	  if ( window[ map_id + 'map'].viewManager.viewState["default-view"] !== undefined ) {
+	  	currentLon = (location === null || location.length == 0) ? window[ map_id + 'map'].viewManager.viewState["default-view"].longitude : location[0];
+	  	currentLat = (location === null || location.length == 0) ? window[ map_id + 'map'].viewManager.viewState["default-view"].latitude : location[1];
+	    currentPitch = pitch === null ? window[ map_id + 'map'].viewManager.viewState["default-view"].pitch : pitch;
+	    currentBearing = bearing === null ? window[ map_id + 'map' ].viewManager.viewState["default-view"].bearing : bearing;
+	    currentZoom = zoom === null ? window[ map_id + 'map'].viewManager.viewState["default-view"].zoom : zoom;
+	    currentMaxZoom = window[ map_id + 'map'].viewManager.viewState["default-view"].maxZoom;
+	    currentMinZoom = window[ map_id + 'map'].viewManager.viewState["default-view"].minZoom;
+	    currentMaxPitch = window[ map_id + 'map'].viewManager.viewState["default-view"].maxPitch;
+	    currentMinPitch = window[ map_id + 'map'].viewManager.viewState["default-view"].minPitch;
 	  } else {
-	  	currentLon = (location === null || location.length == 0) ? window[ map_id + 'map'].viewState.map.longitude : location[0];
-	  	currentLat = (location === null || location.length == 0) ? window[ map_id + 'map'].viewState.map.latitude : location[1];
-	    currentPitch = pitch === null ? window[ map_id + 'map'].viewState.map.pitch : pitch;
-	    currentBearing = bearing === null ? window[ map_id + 'map' ].viewState.map.bearing : bearing;
-	    currentZoom = zoom === null ? window[ map_id + 'map'].viewState.map.zoom : zoom;
-	    currentMaxZoom = window[ map_id + 'map'].viewState.map.maxZoom;
-	    currentMinZoom = window[ map_id + 'map'].viewState.map.minZoom;
-	  	currentMaxPitch = window[ map_id + 'map'].viewState.map.maxPitch;
-	    currentMinPitch = window[ map_id + 'map'].viewState.map.minPitch;
+	  	currentViewState = window[ map_id + 'map'].viewManager.viewState
+	  	currentLon = (location === null || location.length == 0) ? currentViewState.longitude : location[0];
+	  	currentLat = (location === null || location.length == 0) ? currentViewState.latitude : location[1];
+	    currentPitch = pitch === null ? currentViewState.pitch : pitch;
+	    currentBearing = bearing === null ? currentViewState.bearing : bearing;
+	    currentZoom = zoom === null ? currentViewState.zoom : zoom;
+	    currentMaxZoom = currentViewState.maxZoom;
+	    currentMinZoom = currentViewState.minZoom;
+	  	currentMaxPitch = currentViewState.maxPitch;
+	    currentMinPitch = currentViewState.minPitch;
 	  }
 
 	  console.log( currentLon );
 
 		window[map_id + 'map'].setProps({
-	    initialViewState: {
+	    viewState: {
 	      longitude: currentLon,
 	      latitude: currentLat,
 	      zoom: currentZoom,
@@ -61,7 +63,6 @@ function md_change_location( map_id, map_type, location, zoom, pitch, bearing, d
 
 function md_update_style( map_id, style ) {
 
-  var vs = window[ map_id + 'map'].viewState;
 	var map = window[ map_id + 'map'].getMapboxMap();
 	map.setStyle( style );