Here MapAPI,地图渲染失败

Here Map API, map rendering fails

我已经使用反向地理编码方法的值成功创建了地图、标记和信息气泡。对于 1 个位置,地图可以正常工作并相应地显示标记和信息气泡。但是,当我从后端传递两个位置值时(我正在使用 jsp),地图不会呈现。

我使用的函数是:addMarkerToGroupaddInfoBubbleonSuccess

function addMarkerToGroup(group, position, inf){
var marker = new H.map.Marker(position);
//add custom data to marker
marker.setData(inf);
group.addObject(marker);
}

function addInfoBubble(position,inf){

var group = set_map.group;
var map = set_map.map;
var ui = set_map.ui;

map.addObject(group);

//add 'tap' event listener, that opens info bubble, to the group
group.addEventListener('tap', function(evt){
    //event target is the marker itself, group is a parent event target
    var bubble = new H.ui.InfoBubble(evt.target.getPosition(),{
        // read custom data
        content: evt.target.getData()
    });
      //show info bubble
      ui.addBubble(bubble);
}, false);
addMarkerToGroup(group,position,inf);
    }

function callback(){
    var platform = new H.service.Platform({
    app_id: '#',
    app_code: '#',
    useCIT: true,
   useHTTPS: true
   });

   var defaultLayers = platform.createDefaultLayers();

   var obj = your_location.map_obj;

   var map = new H.Map(
    obj,
   defaultLayers.normal.map,
   {
       zoom:your_location.map_zoom,
       center: {lat:your_location.latitude,lng:your_location.longitude}
   });
  var behavior = new H.mapevents.Behavior(new H.mapevents.MapEvents(map));

  var ui = H.ui.UI.createDefault(map, defaultLayers);

  var group = new H.map.Group();
}



function onSuccess(result){
var index = your.count;

var myclt = your.get_yours(index);
var myttl = your.get_title(index);
var myinf = your.get_info(index);

var location = result.Response.View[0].Result[0];
var countryName, countryCode, province, city, zipcode;
countryName = location.Location.Address.Country;
countryCode = location.Location.Address.Country;
province = location.Location.Address.State;
zipcode = location.Location.Address.PostalCode;
city = location.Location.Address.City;

               var address = "";
            if (city && city != "") {
                address = city;
            }

            if (province && province != "") {
                if (address && address != "") {
                    address += ", " + province;
                } else {
                    address = province;
                }
            }

            if (zipcode && zipcode != "") {
                if (address && address != "") {
                    address += ", " + zipcode;
                } else {
                    address = zipcode;
                }
            }

            if (countryName && countryName != "") {
                if (address && address != "") {
                    address += ", " + countryName;
                } else {
                    address = countryName;
                }
            }

            $.ajax({
                url:       "view_remote_device_control.do",
                data:      { 
                    mode:      "update",
                    client_id: myclt,
                    city:      city,
                    province:  province,
                    zipcode:   zipcode,
                    country:   countryCode
                },
                type:      "GET",
                cache:     false,
                async:     true
            });

            myttl += address;





var position =  new    H.geo.Point(location.Location.DisplayPosition.Latitude,location.Location.DisplayPosition.Longitude);

var inf  = {content: location.Location.Address.Label};


var myinfo = inf.content;


addInfoBubble(here_maps_callback.map,position,inf.content,here_maps_callback.ui);
return myinf;

};

调试时出现错误:

未捕获 InvalidArgumentError:H.map.ViewModel#setCameraData(参数 #0 位置)

有点困惑回调是如何发生的,JavaScript 端最终检索到的两个位置在哪里?如果您直接通过 javascript 中的位置,您会遇到问题吗?我的意思是硬编码为测试?

好的,所以我意识到它没有渲染的原因是:

center: {lat:your_location.latitude,lng:your_location.longitude}

基本上由于传递了两个位置值,位置数组有两个纬度和经度值,它不知道用哪个来设置中心。通过将 lat 和 lng 的值都更改为 0 并使用:

map.setCenter(evt.target.getPosition());   

在组事件侦听器中,它相应地呈现了地图。

希望对您有所帮助