首页 > 解决方案 > 如果高度大于宽度,则此处在顶部映射左侧空间

问题描述

我正在为我的网站使用 Here 地图,我需要地图的高度大于宽度。为了做到这一点,当我给出的高度大于宽度时,地图会在顶部留下空白。

在此处输入图像描述

.MapNode.before768{position:absolute;height:auto;display:inline-block;vertical-align:top;}

然后这是我初始化地图的类。

.MapNode .movable_map{height:1150px;}

我的

function loadHeremap(element){
   //api key registration
   var pixelRatio = window.devicePixelRatio || 1;
    var defaultLayers = platform.createDefaultLayers({
      tileSize: pixelRatio === 1 ? 256 : 512,
      ppi: pixelRatio === 1 ? undefined : 320
    });
    var map = new H.Map(document.getElementById(element),
      defaultLayers.normal.map,{
      center: {lat: city_latitude, lng: city_longitude},
      zoom: 7,
      pixelRatio: pixelRatio
    });
}

函数内部发生了许多其他事情,但我认为这是我的问题的关键要素。

标签: jquerycsshere-maps-restheremaps

解决方案


无需通过 CSS 手动设置高度,您可以将高度参数作为h请求 URL 的查询字符串中的键传递:

 https://image.maps.ls.hereapi.com/mia/1.6/mapview
 ?apiKey={YOUR_API_KEY}
 &h=300
 &w=420

这是游乐场链接,用于尝试测试不同的高度和宽度

使用高度和宽度映射图像


推荐阅读