Question

Here is a CodePen demo我在Google地图上显示了一个多边形，并使用“地图标签”库在其上面添加了一个标签。

除了我无法获得标签文字以呈现视网膜屏幕的正确分辨率外，一切都运转良好。

如何在演示环境中显示HiDPI屏幕的地图标签文字？

似乎有一个已知的解决方案here，但我无法弄清楚如何在我的演示中实现该功能。这可能是因为我对JS的了解有限。我相信其他人可以指出在一瞬间做什么。

以下是我的代码的预览，但最好检查CodePen demo：

/* GROUP MAP / STAGE / MAP LABEL
=================================================== */
/* Reference: https://googlemaps.github.io/js-map-label/docs/reference.html */
var mapLabel = new MapLabel({
  text: 'Main Stage',
  position: new google.maps.LatLng(51.420118, -0.064973),
  map: map,
  fontSize: 15,
  fontColor: "#9c0058",
  align: 'left',
});
mapLabel.set('position', new google.maps.LatLng(51.420118, -0.064973));

Answer 1

我设法通过在创建画布的位置将以下代码直接添加到插件来解决这个问题：

.a=document.createElement("canvas");a.width=500;a.height=500;a.style.width="250px";a.style.height="250px";a.getContext('2d').scale(2,2);

我已更新了我的CodePen，因此您可以看到此工作。

如何为Google地图实施视网膜地图标签

1 个答案: