Is it possible to generate a Google Map using my own fields? The location object attribute creates fields I don't need
Add the following to your page or sidebar code. The src includes an API KEY that you will need to get from Google. The forum is changing the src value to a link.
<script src='maps.google.com/.../js type='text/javascript'></script>
<script>
function renderGoogleMap(gaddress ) {
var gOptions = { zoom: 14, mapTypeId: google.maps.MapTypeId.ROADMAP }
var gMap = new google.maps.Map(document.getElementById('gmap_div'), gOptions);
var geocoder = new google.maps.Geocoder();
if (geocoder) {
geocoder.geocode({ address: gaddress }, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
gMap.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({ map: gMap, position: results[0].geometry.location, visible:true });
}
else { document.getElementById('gmap_div').innerHTML='Error: '+status }});
}
}
OnLoad event;
renderGoogleMap("address1,city,state,zip");
Using an HTML component;
create a div with ID=gmap_div.
Yes, you can - use HTML Template Field or Script Component.
So no Rollbase way?
Doing it in a custom way seems to be rather hard. I cannot find a way to implement a Google Map succesfully. <style> tags in HTML components are deleted, empty <div> in HTML components are deleted. <script src="maps.google.com/.../js seems to go ignored, no matter when it's posted in a shared script component, a seperate script component, a document.write('<script src=".......cript>') or a $("#gmapscriptdiv").html('<script src=".....script>'). These last two are interpreted wrong, causing the script to output all script after the </script> as text.
Hi matman,
Have you tried using script component for your HTML and CSS code?
Regards,
Godfrey
Hello,
That is because you use a HTML component which automatically detects and deletes your script tags. Try with a Script Component and you won't have these problems.
Kind regards,
Romain
Were you able to move your code to the script component? Kindly let me know how it goes.
Add the following to your page or sidebar code. The src includes an API KEY that you will need to get from Google. The forum is changing the src value to a link.
<script src='maps.google.com/.../js type='text/javascript'></script>
<script>
function renderGoogleMap(gaddress ) {
var gOptions = { zoom: 14, mapTypeId: google.maps.MapTypeId.ROADMAP }
var gMap = new google.maps.Map(document.getElementById('gmap_div'), gOptions);
var geocoder = new google.maps.Geocoder();
if (geocoder) {
geocoder.geocode({ address: gaddress }, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
gMap.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({ map: gMap, position: results[0].geometry.location, visible:true });
}
else { document.getElementById('gmap_div').innerHTML='Error: '+status }});
}
}
OnLoad event;
renderGoogleMap("address1,city,state,zip");
Using an HTML component;
create a div with ID=gmap_div.