Playground and DEMO space
This is a playground and demo space for ConfiForms and ConfiDoc addons developed and supported by Vertuna LLC
Most pages provide a storage format for the demo, so you can use the free add-on from Atlassian Confluence Source Editor to import this configuration into your Confluence and see it in action
To import examples from the storage format on Confluence Cloud please see this page
Please note, all the examples here are provided without any obligation and may or may not be incomplete or may have bugs, and we provide NO SUPPORT for these examples and demos.
<%-- google geocoding maps--%> <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAnRA1CvBUdFF22IYWlK_dKmW71Vl-Mz7M&v=3.exp&sensor=false"></script> <div id='mapOnWorkItemDiv' class="minimap"></div> <script> function addMarkerOnMap(loc) { if ($('#endAddrLatitude')) { $('#endAddrLatitude').val(loc.lat()); } if ($('#endAddrLongitude')) { $('#endAddrLongitude').val(loc.lng()); } addMarker(loc); } function showLocationOnMapDiv(loc) { var mapOptions = { zoom: 15, center: loc, mapTypeId: google.maps.MapTypeId.ROADMAP } $('#mapOnWorkItemDiv').css('height', '280px').css('border', '#555555 1px solid').fadeIn(); if ($('#addrLatitude')) { $('#addrLatitude').val(loc.lat()); } if ($('#addrLongitude')) { $('#addrLongitude').val(loc.lng()); } map = new google.maps.Map(document.getElementById('mapOnWorkItemDiv'), mapOptions); map.setCenter(loc); addMarker(loc); } function addMarker(loc) { var marker = new google.maps.Marker({ map: map, animation: google.maps.Animation.DROP, position: loc }); tryToDisplayRoute(); } function tryToDisplayRoute() { if ($('#addrLatitude') && $('#addrLatitude').val() != '' && $('#addrLongitude') && $('#addrLongitude').val() != '' && $('#endAddrLatitude') && $('#endAddrLatitude').val() != '' && $('#endAddrLongitude') && $('#endAddrLongitude').val() != '') { var start = new google.maps.LatLng($('#addrLatitude').val(), $('#addrLongitude').val()); var end = new google.maps.LatLng($('#endAddrLatitude').val(), $('#endAddrLongitude').val()); displayRoute(start, end); } } function displayRoute(startLoc, endLoc) { var directionsService = new google.maps.DirectionsService(); var directionsDisplay = new google.maps.DirectionsRenderer();// also, constructor can get "DirectionsRendererOptions" object directionsDisplay.setMap(map); // map should be already initialized. var request = { origin : startLoc, destination : endLoc, travelMode : google.maps.TravelMode.DRIVING }; directionsService.route(request, function(response, status) { if (status == google.maps.DirectionsStatus.OK) { directionsDisplay.setDirections(response); } }); } <script> <script> showLocationOnMapDiv(new google.maps.LatLng(40.730610, -73.935242, true)); </script>