Forum | Appery.io

I tried typing it manually and pasting it. The screen shot is from when I tried typing it in manually The result was exactly the same either way it was entered.

Hello.

I also have the same question.

Once edited the mapping.

I load this code in my screen:

var directionDisplay;
var directionsService = new google.maps.DirectionsService();

function initialize() {
directionsDisplay = new google.maps.DirectionsRenderer();
}

function displayDirections(sourceAddress,destinationAddress, map) {
var request = {
origin: sourceAddress,
destination: destinationAddress,
travelMode: google.maps.DirectionsTravelMode.DRIVING
};
directionsService.route(request, function(response, status) {
directionsDisplay.setMap(map);
if (status == google.maps.DirectionsStatus.OK) {
directionsDisplay.setDirections(response);
} else {
alert("Directions query unsuccessful. Response status: " + status);
}
});
}

and I load this code in my button

var destinationAddress = Appery("destAddress").val();
var long = localStorage.getItem('longitude');
var latit= localStorage.getItem('latitude');
var sourceAddress = new google.maps.LatLng(latit,long);
var map = Appery("googlemap_12").gmap;
displayDirections(sourceAddress,destinationAddress,map);

But not calculates me the route.

Not be that I'm doing wrong.

Hi Laura,

Do the variables (destinationAddress, long, latit) have correct values when you run the script? Are there any errors in browser console?

Hi katya:

Geolocation:

And then:

I Add succes:

And then I invoke the service in my screen.

It's ok!

But then I have a button and I want to calculate the route from my geopositioning to a destination (latitude, longitude).

And I load in my screen:
var directionDisplay;
var directionsService = new google.maps.DirectionsService();

function initialize() {
directionsDisplay = new google.maps.DirectionsRenderer();
}

function displayDirections(sourceAddress,destinationAddress, map) {
var request = {
origin: sourceAddress,
destination: destinationAddress,
travelMode: google.maps.DirectionsTravelMode.DRIVING
};
directionsService.route(request, function(response, status) {
directionsDisplay.setMap(map);
if (status == google.maps.DirectionsStatus.OK) {
directionsDisplay.setDirections(response);
} else {
alert("Directions query unsuccessful. Response status: " + status);
}
});
}

[url=https://d2r1vs3d9006ap.cloudfront.net/s3_images/976565/loadscreen.jpg?1382689828][img]https://d2r1vs3d9006ap.cloudfront.net/s3_images/976565/loadscreen_inline.jpg?1382689828[/img] [/url] 

and finally

in my button, I add click and javascript:

var destinationAddress = Appery("destAddress").val();
var long = localStorage.getItem('longitude');
var latit= localStorage.getItem('latitude');
var sourceAddress = new google.maps.LatLng(latit,long);
var map = Appery("googlemap_12").gmap;
displayDirections(sourceAddress,destinationAddress,map);

I have tried in different ways:

The first:

var destinationAddress = Appery("destAddress").val();
var long = localStorage.getItem('38.8167');
var latit= localStorage.getItem('-0.6167');
var sourceAddress = new google.maps.LatLng(latit,long);
var map = Appery("googlemap_12").gmap;
displayDirections(sourceAddress,destinationAddress,map);

The second:

var sourceAddress = Appery("sourceAddress").val();
var long = localStorage.getItem('longitude');
var latit= localStorage.getItem('latitude');
var destinationAddress = new google.maps.LatLng(38.8167,-0,6167);
var map = Appery("googlemap_12").gmap;
displayDirections(sourceAddress,destinationAddress,map);

But not calculates me the route.

My console is this:

thanks for your help.

I think that I'm wrong with the javascript button.

But not be that I'm doing wrong.

Hello! The problem is that you've added this code on page Load event
prevar directionDisplay;
var directionsService = new google.maps.DirectionsService();
function initialize() {
directionsDisplay = new google.maps.DirectionsRenderer();
}
function displayDirections(sourceAddress,destinationAddress, map) {
var request = {
origin: sourceAddress,
destination: destinationAddress,
travelMode: google.maps.DirectionsTravelMode.DRIVING
};
directionsService.route(request, function(response, status) {
directionsDisplay.setMap(map);
if (status == google.maps.DirectionsStatus.OK) {
directionsDisplay.setDirections(response);
} else {
alert("Directions query unsuccessful. Response status: " + status);
}
});
} /pre
so these functions and variables are local and you can't call them from code on button click. You have to add this code to JS asset (please check tutorial).

Sorry,This tutorial?

http://docs.appery.io/tutorials/build...

yes

I have followed the manual.

I created a JavaScript with this code:

var directionDisplay;
var directionsService = new google.maps.DirectionsService();
function initialize() {
directionsDisplay = new google.maps.DirectionsRenderer();
}
function displayDirections(sourceAddress,destinationAddress, map) {
var request = {
origin: sourceAddress,
destination: destinationAddress,
travelMode: google.maps.DirectionsTravelMode.DRIVING
};
directionsService.route(request, function(response, status) {
directionsDisplay.setMap(map);
if (status == google.maps.DirectionsStatus.OK) {
directionsDisplay.setDirections(response);
} else {
alert("Directions query unsuccessful. Response status: " + status);
}
});
}

And I load in my screen with:

initialize();

It's ok!

In my case I don't have inputs, I want a button that this button loads my route.

I add in my button this code. eventbuttonClicrun javascrit

var destinationAddress = new google.maps.LatLng(38.8667,-0.5167);
var sourceAddress = new google.maps.LatLng(38.8167,-0.6167);
var map = Appery("googlemap_12").gmap;
displayDirections(sourceAddress,destinationAddress,map);

This route if that is calculated

But I want to calculate my route from my position to a fixed point. in this case the fixed point (38.8667, - 0.5167).

How I do you calculate me the route from my position to the point fixed?

Invoke Geolocation service. Save coordinates returned with service response to localStorage variable and use these coordinates in your code. Please note that you can click the button before service call is finished. So you can make button not active by default and on service success activate it, or invoke code on service success event instead click button.