I have a problem using links in leaflet marker popups:
My loop assigns a link to every popup so I can open the specific source by clicking the popup
var link = "Grafik erstellen";
L.marker([lat,lon], {icon: marker}).bindPopup(link).addTo(map);
It´s possible to open the link which appears in the popup, but I need to open it in a new (popup) window (simulate the windows-function of right-mouse-click: "open in new tab")
How can I realize this issue?
Thanks a lot for help
try this, add the target="_blank" attribute to the a href=""...-tag:
var link = "Grafik erstellen";
L.marker([lat,lon], {icon: marker}).bindPopup(link).addTo(map);
Related
Not too long ago, people had a really hard time getting all popups to close on map click in mapbox (How to close all popups programmatically in mapbox gl?).
They've since changed this to the default behavior, which is nice, but does not suit my current project.
How does one NOT have all popups close on click out?
And once that is disabled:
How does one programmatically close selected popups on click out?
Like this:
const popup = new mapboxgl.Popup({ closeOnClick: false });
map.on('click', () => popup.remove());
I am using leaflet to show my markers into google map. everything works fine. My markers are being loaded by an api call in every 10 secs. if i click on any markers a popup window is open. But it disappeared as soon as the api is called again. I have tried so far as follows:
var infoWindow_content = "<h3>Hello world</h3>";
var theMarker = L.marker([devices[x].lat, devices[x].lng], {
icon: customicon,
rotationAngle: devices[x].angle
}).on('click', markerOnClick).addTo(map).bindPopup(infoWindow_content, {
autoPan: true,
autoClose:false,
closeOnClick:false,
});
is there anyway to keep the popup window open even the marker gets reloaded? In that case is the popup window follow marker movement? thanks in advance
I have a very simple issue:
I have a rectangle. I would like to link a website to that rectangle which will be opened on click on a new web browser window.
I do not want to apply pop-up option.
Attach a click handler to your rectangle and open a new window/tab in the handler function:
// Create rectangle and add to map
var rectangle = new L.Rectangle([
[54.559322, -5.767822],
[56.1210604, -3.021240]
]).addTo(map);
// Attach clickhandler
rectangle.on('click', function(){
// Open new window/tab
window.open('www.example.org','_blank');
});
This question already has an answer here:
SAPUI5 Open link on Button press
(1 answer)
Closed 1 year ago.
I am relatively new to UI5. My search for "[sapui5] icon link" brought no useful results. So here is my question.
I have the following sap.m.Link
<Link id="myLink" href="http://stackoverflow.com/" text="Stackoverflow" />
which displays the text "Stackoverflow" on the UI, and when I click on it, I will navigate to stackoverflow.com. That's the effect I want.
But how can I replace the text with an icon, for example "sap-icon://download"? According to the Link-API, it doesn't have an attribute icon. So is there a way to get the same effect using sap.m.Button that does have this attribute:
<Button icon="sap-icon://download" press=".onDataExport" />
What would the handler onDataExport look like? My idea is to use a (somehow) hidden sap.m.Link and a sap.m.Button containing the icon. The press-handler of the Button would then somehow trigger a 'link clicked' (not sure if that is possible).
My answer comes a bit late, but I hope that it will help others, as I searched for a ready-to-use Link including an Icon (although this does not seem to be the real need of StoneCrusher).
Button which triggers link navigation:
If you want a sap.m.Button to act like a classical link, then you can attach a press event and use window.open in that event, like:
myButton.attachPress(function () {
window.open(url,target);
});
Link with UI5 icon:
If you want to display a sap-icon in a sap.m.Link, then you have to extend the link, include an aggregation which contains the icon and then render the icon before you render the text of the link.
renderer : function(oRm, oControl) {
[...]
oRm.write("<a");
oRm.writeControlData(oControl);
oRm.addClass("sapMLnk sapMLnkMaxWidth touconLink");
oRm.writeClasses();
oRm.write("href=\"javascript:void(0);\" ");
oRm.write(">");
//Render icon
if (icon!="") {
oControl.getAggregation("_icon").setIcon(icon);
oRm.renderControl(oControl.getAggregation("_icon"));
}
oRm.writeEscaped(text);
oRm.write("</a>");
}
I was in need of both and published these and other custom UI5 convenience controls here: www.toucon.fr
Use the below code in your onDataExport function in controller:
sap.m.URLHelper.redirect("https://stackoverflow.com/", true);
Refer to the below link for info: ui5.sap.com/#/sample/sap.m.sample.Link/preview
sorry only got reply in JSON style, but you see what is missing in your code:
jQuery.sap.require("sap.ui.core.IconPool");
var sBack = sap.ui.core.IconPool.getIconURI("nav-back");
var button = new sap.ui.commons.Button({
icon : sBack,
});
The leaflet documention shows you can add a popup to a marker with
marker.bindPopup("<b>Hello world!</b><br>I am a popup.").openPopup();
or create a standalone popup with
var popup = L.popup()
.setLatLng([51.5, -0.09])
.setContent("I am a standalone popup.")
.openOn(map);
Is there no way to set popup options and bind it to a marker? I want to be able to set my own maxwidth for popups and have them open/close when you click a marker.
Are you sure that you're reading the Leaflet reference documentation? It specifies that you can bind a popup with options by creating it and calling .bindPopup with it. For instance,
var popup = L.popup()
.setContent("I am a standalone popup.");
marker.bindPopup(popup).openPopup();
You can pass an object of popup options as the second argument of bindPopup, like this:
marker.bindPopup("<strong>Hello world!</strong><br />I am a popup.", {maxWidth: 500});
I've tested this in Leaflet 1.4, and it also seems be available in earlier versions of bindPopup.
For maxWidth you should do this:
var popup = L.popup({
maxWidth:400
});
marker.bindPopup(popup).openPopup();