如何在传单中制作可点击的弹出工具提示/弹出窗口?

时间:2018-08-14 18:09:58

标签: angular typescript leaflet tooltip

在我的应用中,我有下面的代码:

首先,我声明了变量: historyItemLayer:任意;

那么我有一个包含许多历史点的数组。

history.forEach(i => {
  history_vertex.push(new L.LatLng(i.latitude, i.longitude));
  const iconToShow = 'assets/images/markers/arrows/arrow_green_0g.png';
  const targetIcon = L.icon({
          iconRetinaUrl: iconToShow,
          iconUrl: iconToShow,
          shadowUrl: '',
          iconSize: [24, 24], // size of the icon
          shadowSize: [0, 0], // size of the shadow
          iconAnchor: [12, 12],
          shadowAnchor: [0, 0],  // the same for the shadow
          popupAnchor: [-12, -12] 
        });

   const selected_history_item = L.marker( L.latLng(i.latitude, i.longitude), { icon: targetIcon });
   selected_history_item.bindTooltip('<div style="width: 300px; display:inline-block;"><small style="white-space: pre-line;">' + i.address +'</small></div>' , { permanent: false, direction: 'top' }).openTooltip();
          selected_history_item.addTo(this.historyItemLayer);
});
const history_polyline = new L.Polyline(history_vertex, polylineOptions);
history_polyline.addTo(this.historyLayer);
this.map.fitBounds(this.historyLayer.getBounds());

如果看到的话,permanent: false ...中就有bindTooltip个人身份。

我需要在地图中隐藏所有工具提示,并在单击图标时显示工具提示 我怎么做? 有没有我想念的东西,或者我只是在编码wearg? 请帮助

0 个答案:

没有答案