问题
Here is my javascript for a world map. The idea is for the tooltip pop-up to contain a link to a url, allow the user to click on it and have the url open in another tab/window. tooltip just moves away from pointer, no way to click on embedded tag with url. How to stop the tooltip from moving away from pointer? (tooltipPosition: fixed or pointer did not change anything)
// Create map instance
var chart = am4core.create("chartdiv", am4maps.MapChart);
// Set map definition
chart.geodata = am4geodata_worldLow;
// Set projection
chart.projection = new am4maps.projections.Miller();
// Disable Zoom and Pan
chart.seriesContainer.draggable = false;
chart.seriesContainer.resizable = false;
chart.maxZoomLevel = 1;
// Series for gray background map
var worldSeries = chart.series.push(new am4maps.MapPolygonSeries());
worldSeries.exclude = ["AQ"];
worldSeries.useGeodata = true;
var polygonTemplate = worldSeries.mapPolygons.template;
polygonTemplate.fill = am4core.color("#ebebeb");
// Create map polygon series
var polygonSeries = chart.series.push(new am4maps.MapPolygonSeries());
// Make map load polygon (like country names) data from GeoJSON
polygonSeries.useGeodata = true;
// Configure series
var polygonTemplate = polygonSeries.mapPolygons.template;
polygonTemplate.tooltipHTML = "{name}<br/><a style=\"color:white; text-decoration: underline;\" href=\"{site}\" target=\"_blank\">{site}</a><br/>{email}<br/>{phone}";
polygonTemplate.adapter.add("tooltipHTML", function (html, ev) {
if (!ev.dataItem.dataContext.site) {
return "{name}";
}
return html;
})
polygonTemplate.fill = am4core.color("#6f52a8");
polygonSeries.tooltip.interactionsEnabled = true; // allow interaction
polygonSeries.tooltip.pointerOrientation = "vertical";
// Create hover state and set alternative fill color
var hs = polygonTemplate.states.create("hover");
hs.properties.fill = am4core.color("#442580");
// Include
polygonSeries.include = ["AD", "AR", "AM" , "AU", "AT", "BS" , "BB", "BZ", "BM", "BO", "BR",, "BG", "KH", "CM", "CA", "CL", "CN", "CO" , "HR", "DO", "AE", "EC", "EG", "DE", "GT", "HN", "HK", "IN", "ID", "IR", "IQ", "IL", "IT", "JP", "JO", "KW", "LB", "LY", "MK", "MX", "MM", "NL", "NG", "PK", "PA", "PY", "PE", "PH", "PR", "RU" , "SA", "RS", "SG", "SR", "CH", "TW", "TT", "TR", "UA", "GB", "US", "VE", "VN"
];
来源:https://stackoverflow.com/questions/54819873/amcharts-4-interactive-content-in-tooltips-on-worldmap-not-working