(First Overstack Post so please forgive me in advance for any posting mistakes.)
I am using SharePoint 2010. I have created a wiki page that contains a google map that displays multiple marker locations from a sharepoint list that is also on the wiki page. The list has two columns (multi-line text) one that contains the address and the other information about the location. The google map API V3, gets each address from the list, places a marker at the location, and displays in a marker infowindow information about that location.
My problem is that the line returns in the information column do not appear in the infowindow on the map. The infowindow displays the information as single line text that raps in the info window. How do I keep the formating (most concerned about the line returns) from the SharePoint List information column in the infowindow?
<!--initialize is a function that needs to run when the page is loaded-->
<body onload="initialize()">
<form id="form1" runat="server">
<asp:ScriptManager runat="server" id="ScriptManager"></asp:ScriptManager>
<!--js?key is developer's API Key that can be gotten for free at http://ift.tt/1A6Ykrt;
<script type="text/javascript" src="http://ift.tt/1A6Yj6M"></script>
<script type="text/javascript" src="http://ift.tt/ILQp6H"></script>
<!--width and height can be px or %-->
<div id="map_canvas" style="width: 700px; height: 500px"></div>
<script type="text/javascript">
// set up the basic map object
var latlng = new google.maps.LatLng(21.4667, 152);
var myOptions = {
zoom: 2,
center: latlng,
mapTypeId: google.maps.MapTypeId.SATELLITE
};
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
// this is used for geocoding
var geocoder = new google.maps.Geocoder();
function codeAddress(address, info) {
geocoder.geocode( { 'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location
});
//this is needed for the marker's pop-up window, known as an infowindow.
var infowindow = new google.maps.InfoWindow({
content: info,
maxWidth: 60 });
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map,marker);
});
} else {
alert("Geocode was not successful for the following reason: " + status);
}
});
}
// this is called with body's onload to pull addresses after the page is done loading.
function initialize() {
$("tr.ms-itmhover").each(function(i){
codeAddress($(this).find('.ms-rtestate-field:eq(0)').text(), $(this).find('.ms-rtestate-field:eq(1)').text());
});
}
</script>
SharePoint List Example:
Address: Information: Jackson MI 5 Personnel Vacation 10 Personnel Office 1 11 Personnel Office 2
Vancouver BC Canada 2 Personnel Vacation 20 Personnel Office 1 12 Personnel Office 2 5 Personnel Office 3
Infowindow Example: Marker shows on Jackson MI Infowindow shows: 5 Personnel Vacation 10 Personnel Office 1 11 Personnel Office 2
Of course all marker infowindows do this. Any help would be appreciated!
I have search Overstack for related post and have not seen any. On the web I have not found situations where formatting is being used from a SharePoint list to format the infowindow. I have seen how to format an infowindow using CSS but not how to keep the line returns from a SharePoint list.
Aucun commentaire:
Enregistrer un commentaire