如何在Google Maps InfoWindow中单击电子邮件ID时打开电子邮件应用程序 [英] How to Open email application while clicking on the email ID in google Maps InfoWindow
问题描述
我想在Google Maps信息窗口中单击电子邮件ID时，打开带有预填充主题"SUBJECT"的电子邮件应用程序.以下是我编写的用于显示电子邮件ID的代码，但我不确定如何继续进行操作.
I want to Open the email application with prepopulated subject 'SUBJECT' while clicking on the email ID in the google Maps Info window. Below is the code i wrote to Display the email ID and I am not sure how to proceed further.
function init(resp) {
var mapProp = {
center : new google.maps.LatLng(resp.data[0].Lat,
resp.data[0].Lon),
zoom : 7,
};
var map = new google.maps.Map(document.getElementById("googleMap"),
mapProp);
$.each(resp.data, function(index, value) {
var myLatlng = new google.maps.LatLng(value.Lat, value.Lon);
var marker = new google.maps.Marker({
position : myLatlng,
label : value['Number'],
content : "Phone: " + value['Phone Number'] + '<br>'
+ "E-Mail: " + '<a href="'+ value['E-Mail']+'">'+ value['E-Mail'] +'</a>'
});
var infowindow = new google.maps.InfoWindow({
content : "Phone: " + value['Phone Number'] + '<br>'
+ "E-Mail: " + '<a href="'+ value['E-Mail']+'">'+ value['E-Mail'] +'</a>'
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map, marker);
});
// To add the marker to the map, call setMap();
marker.setMap(map);
});
推荐答案
您可以使用 邮件到 .您可以更改不同参数的值以适合您的电子邮件.
You can use the mailto of JavaScript. You can change the values of different parameters to suit your email.
因此，在您的代码中，您可以将类似这样的内容作为您的信息窗口中的内容:
So in your code, you can put something like this as your content in your InfoWindow:
var infowindow = new google.maps.InfoWindow({
content :'<div id="content">'+
'<a href="mailto:username@example.com?subject=Subject&body=message%20goes%20here">'+
'Click to Email</a> '+
'</div>'
});
以下是示例代码.要查看其工作原理，您可以将其复制并保存为html文件，然后在浏览器中运行.请注意更改您的API密钥:
The following is a sample code. To see how this works, you can copy and save it as html file and run it in your browser. Please note to change your API Key:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<title>Info Windows</title>
<style>
/* Always set the map height explicitly to define the size of the div
* element that contains the map. */
#map {
height: 100%;
}
/* Optional: Makes the sample page fill the window. */
html, body {
height: 100%;
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<div id="map"></div>
<script>
// This example displays a marker at the center of Australia.
// When the user clicks the marker, an info window opens.
function initMap() {
var uluru = {lat: -25.363, lng: 131.044};
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 4,
center: uluru
});
var contentString = '<div id="content">'+
'<a href="mailto:username@example.com?subject=Subject&body=message%20goes%20here">'+
'Click to Email</a> '+
'</div>';
var infowindow = new google.maps.InfoWindow({
content: contentString
});
var marker = new google.maps.Marker({
position: uluru,
map: map,
title: 'Uluru (Ayers Rock)'
});
marker.addListener('click', function() {
infowindow.open(map, marker);
});
}
</script>
<script async defer
src="https://maps.googleapis.com/maps/api/js?key=CHANGE_API_KEY_HERE&callback=initMap">
</script>
</body>
</html>
希望这会有所帮助！
这篇关于如何在Google Maps InfoWindow中单击电子邮件ID时打开电子邮件应用程序的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
