[Gertkok]

Great! The map loads faster now as well, probably because a lot (8-12) of 404 errors are gone. Previously, material could not be found from ks0.google….. or ks1.google…… The url’s of that material had different tails like gali, galil, galile etc. I serve this info from my memory, so the minor details might differ a bit.

 

 

 

[Gertkok]

I replaced the last line of geolocator.js:

google.maps.event.addDomListener(window, ‘load’, wida_homePosition);

 

with these 3, which give me a better result. The map is shown at the page.
jQuery(document).ready(function() {
wida_homePosition();
});

 

[Gertkok]

field_hdmyac and field_52snxh are keys of the Formidable fields.

wida_map is the id of the <div>

 

//<![CDATA[
var wida_latId = ‘field_hdmyac’;
var wida_lngId = ‘field_52snxh’;
var wida_mapId = ‘wida_map’;
//]]>

[Gertkok]

It is almost working, I miss initialisation when the form is shown (see last line )

To be done: add default positions when browser has no navigator.geolocation
————————————————————————————-
This is content of a Formidable HTML element:

<div id = “wida_map” style = “width: 100%; height: 300px”></div>
<br>
<input type = “Button” value = “Home Position” onclick = wida_homePosition() “/>
<script type=”text/javascript”>
//<![CDATA[
var wida_latId = ‘field_hdmyac’;
var wida_lngId = ‘field_52snxh’;
var wida_mapId = ‘wida_map’;
//]]>
</script>
9(another possibility is make a field like:
<type input = “hidden” id=”wida_identifiers” value=”wida_latId=field_hdmyac&wida_lngId=field_52snxh&wida_mapId=wida_map”>
Which may be a littlebit more easy for some Formidable developers, but then the Javascript should decode this string

————————————————————————————-

Add 2 custom fields to the post type , type of the custom field is numeric
create at least one post of this type to make this fieldnames visible for MapPress and Formidable:

latitude
longitude

————————————————————————————-

Make 2 fields on the Formidable form that will be entered in this custom fields latitude and longitude

Config MappPress to use these custom fields for automatic generating a map with the fields

—————————————————————————————-
This is added to the functions.php of the theme to include javascript.
Probably it can be do

If you have a google api key replace FILL-KEY-HERE with the key

function my_scripts_method() {
wp_enqueue_script(‘GoogleApis’, ‘//maps.googleapis.com/maps/api/js?key=FILL-KEY-HERE&sensor=false’);
wp_enqueue_script(‘wadi_GeoLocate’,
‘www.watisdatdaar.nl/y/wp-content/themes/watisdatdaar/js/geolocate.js’,
get_stylesheet_directory_uri() . ‘/js/geolocate.js’,

array(‘GoogleApis’),
”
);
}
//wp_enqueue_scripts

if (!is_admin()) add_action(‘wp_enqueue_scripts’, ‘my_scripts_method’);
—————————————————————————————-
geolocate.js

/* Id’s as entered on the Formidable Form
var wida_latId = ‘field_hdmyac’;
var wida_lngId = ‘field_52snxh’;
var wida_mapId = ‘wida_map’;
*/
var wida_map;
var wida_marker;

function wida_homePosition() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(wida_successHandler, wida_errorHandler);
}
}

function wida_successHandler(location) {

// Combine from raw json: latitude and the longitude;

var lat = location.coords.latitude;
var lng = location.coords.longitude;

var myLatLng = new google.maps.LatLng(lat, lng);

if (!wida_map) {
wida_initialize(myLatLng);  // Called on first usage (is homeposition at startup)
}
wida_placeMarker(myLatLng);

}

// report errors to user
function wida_errorHandler(error) {
switch (error.code) {
case error.PERMISSION_DENIED:
alert(“Could not get position as permission was denied.”);
break;
case error.POSITION_UNAVAILABLE:
alert(“Could not get position as this information is not available at this time.”);
break;
case error.TIMEOUT:
alert(“Attempt to get position timed out.”);
break;
default:
alert(“Sorry, an error occurred. Code: ” + error.code + ” Message: ” + error.message);
break;
}
}

function wida_initialize(latLng) {

var mapOptions = {
zoom: 10,
center: latLng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
wida_map = new google.maps.Map(document.getElementById(wida_mapId), mapOptions);
wida_marker = new google.maps.Marker({
map: wida_map
});

google.maps.event.addListener(wida_map, ‘click’, function(event) {
wida_placeMarker(event.latLng);
});

}

/*
* onClick handler for GoogleMap on the invulformulier, also used by wida_homePosition
*/

function wida_placeMarker(latLng) {

wida_marker.setPosition(latLng);
wida_map.setCenter(latLng);

wida_setNumbers(latLng);
}

function wida_setNumbers (latLng) {
document.getElementById(wida_latId).value = latLng.lat();
document.getElementById(wida_lngId).value = latLng.lng();
}

/* looks like this is not called yet */
google.maps.event.addDomListener(window, ‘load’, wida_homePosition);

[Gertkok]

The usage of entering formfield-data is by a website’s visitor, at the frontend of the site. The formdata are saved, not the map. Using click-events is defined in the GoogleMaps API.

I think I will place Javascript in my functions.php. Can I assume the id: ‘mapp0_layout’ if there is only one map on a page?

[Gertkok]

But after inserting more markers, the difference between the two maptypes disappeared…

[Author]

Posts