如何在不使用 cookie 的情况下为未来的会话存储用户选择的缩放 Google Geocoder API

Question

使用带有 Java 后端、Velocity 前端和 Oracle 数据库的 Google 地理编码器 api v.3。

我们当前的规范规定，当用户选择一个标记 (lat/lng) 时，他们的缩放也应该被保存以用于未来的会话。我一辈子都想不出怎么做。我已经看到了一些关于边界的信息，我认为我可以以 hackkey 的方式使用它们，但我不想定义地图的边界，我只想保存缩放（比如 lat/lng ) 并能够将其传递到后端。

map.js

var geocoder;
var map;
var siteLocation;
var marker;

function initMap() {
  var lat = parseFloat($("#newLat").val());
  var lng = parseFloat($("#newLng").val());
  geocoder = new google.maps.Geocoder();
  siteLocation = { lat: lat, lng: lng };
  map = new google.maps.Map(document.getElementById('map'),
    {
      center: siteLocation,
      zoom: 19,
    }
  );
  //set crosshair
  console.log('setting waypoint marker');
  crosshair = new google.maps.Marker(
    {
      position: siteLocation,
      map: map,
      draggable: false,
      shape: { coords: [0, 0, 0, 0], type: 'rect' },
      icon: "https://www.daftlogic.com/images/cross-hairs.gif"
    }
  );


  crosshair.bindTo('position', map, 'center');
  geocodeLatLng();
}

//use new selection to 
function geocodeLatLng() {
  var lat = crosshair.getPosition().lat();
  var lng = crosshair.getPosition().lng();
  var newLocation = crosshair.getPosition();
  geocoder.geocode({ location : crosshair.position}, function(results, status) {
    if (status == 'OK') {
      results[0].geometry.location.lat();
      results[0].geometry.location.lng();
    } else {
      alert("Geocode was not successful for the following reason: " + status);
    }
  });
}

//get new user selected map options, [drop marker] (optional)
$("#addGeolocation").on("click", function (evt) {
  geocodeLatLng();
  evt.preventDefault();
  var newZoom = map.getZoom();
  var newLat = crosshair.getPosition().lat();
  var newLng = crosshair.getPosition().lng();
  $("#newLat").val(newLat);
  $("#newLng").val(newLng);
  newLocation = new google.maps.LatLng(newLat, newLng);
  map.setCenter(newLocation);
  map.setZoom(newZoom);
  //make sure no marker exists
  if ( marker !== undefined) {
      marker.setPosition(newLocation);
    } else {
      marker = new google.maps.Marker({
          position: newLocation,
          map: map,
          draggable: true
      });
    }
});

速度宏

#macro(map $ADDRESS)
    <script  defer
    src="https://maps.googleapis.com/maps/api/js?key=${GOOGLE_API_KEY}&callback=initMap">
    </script>
    <div id="map"></div>
    <span class="innerBlock smallBlock" id="map" ></span>
    <button type="button" onclick="geocodeLatLng()" id="addGeolocation"> $BTN_ADD_GEOLOCATION</button>
    #inp_hidden("newLat" "$context.getSite().getLatitude()")
    #inp_hidden("newLng" "$context.getSite().getLongitude()")
    #inp_hidden("newZoom")
#end

我完全被难住了。有任何想法吗？我见过的大多数解决方案都涉及 cookie，但我们不能使用它们。任何意见，将不胜感激。谢谢！

Answer 1

我想我理解你的意思，但如果我错了请纠正我。

您可以将缩放级别保存在变量中。

var zoom = 16;

然后保存到本地

localStorage.setItem("zoomLevel", zoom);

然后使用 getItem 方法检索它

var savedZoom = localStorage.getItem("zoomLevel");

因此，如果您打算将缩放级别放在 select 框中或其他内容中，您可以将用户的选择保存到本地存储中，然后在他们 return 时通过设置来检索它例如放大到 'savedZoom'。

我不完全确定这是否是您想要的，但希望对您有所帮助。我尽量不去讲太多细节，以防万一。

如何在不使用 cookie 的情况下为未来的会话存储用户选择的缩放 Google Geocoder API

How to store user selected zoom for future sessions without using cookies Google Geocoder API

javascript

java

velocity

google-geocoding-api

map.js