- 724 Posts
- 3 Reply Likes
Posted 4 years ago
- 724 Posts
- 3 Reply Likes
Have a goodnewsful day!
Almost I fixed the static map loading problem, it's taking small time now, and I have also set a preloading image, by use can little wait untill map is not loading.
-I recognized that plugins are working fine, the problem is that the HTTP request to map.google.com....taking time according to network, if network is good loading after little time, and if network is bad taking a little more time.
-Now the recent problem is that the static map sometime not showing map labels. without labels how we can know that where we are in the map.
-I dont know y occuring this problem, but i have little doubt on cache, i have read that recent viewed page store on cache , I think when again i am opening post complaint page it's not updating map, when we are reloading page now it is fetching map, can i use a little button on page to reload not the entire page, but image? Because sometime signals are good and sometime bad, user can reload this image by tapping a little icon on page(Reload map). By this if labels are not showing may on reloading image they show? M i right?
Or another problem there fore not showing labels?
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
without labels how we can know that where we are in the map.I don't understand this.
The user is standing there, with his device in his hand. A map is displayed (at an appropriate zoom level, I hope) and a pin is placed at his exact position.
How can he NOT know where he currently is, without labels? The street names are on the map, or at least the environment contours. Al he needs to do is look around and see that his surroundings are exactly what the map displays.
Now the recent problem is that the static map sometime not showing map labels.When is "sometimes"? Is it really a matter of bad connection or something else?
Anyway, sure...if you want a reload button next to the image, then do so.
Make sure you also get the location again, because the user might have moved on for half a mile or so.
- 724 Posts
- 3 Reply Likes
-Okay, this button is only for the time, when image want reload to fetch the current location.The reload button can be helpful, because static map is only updating when page is loaded, and when use moved to another place, he do not need to reload the enitre page to fetch the current location, he can just reload this image? to fetch the current location again.
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
And yes,
he do not need to reload the enitre page to fetch the current location, he can just reload this image?
that's right. You can set the source of the image again, which will reload, unless cached. You can prevent caching by adding a timestamp to the query string in the image url.
- 724 Posts
- 3 Reply Likes
You can prevent caching by adding a timestamp to the query string in the image url.
var img_url = "http://maps.googleapis.com/maps/api/staticmap?center="+new Date().getTime()
+latlon+"&zoom=18&size=220x220&sensor=false&markers="+latlon+"&size:mid%7Ccolor:0xff0000%7Clabel:%7Camroha,+uttar+pradesh&visual_refresh=true";
In this way?
- 724 Posts
- 3 Reply Likes
New variable, to assign a new query string?
In new query string what I will use, ?
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
Google "image prevent caching timestamp query string" if you really don't know how.
- 724 Posts
- 3 Reply Likes
I found some solutions, but they are making me more confusing,
which is for me can u plz tell me plz Sir, a little hint more:
http://stackoverflow.com/questions/72...
http://stackoverflow.com/questions/21...
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
var img_url = "http://maps.googleapis.com/maps/api/staticmap?mytimestamp="+new Date().getTime()
+"¢er="+latlon
+"&zoom=18&size=220x220&sensor=false&markers="+latlon
+"&size:mid%7Ccolor:0xff0000%7Clabel:%7Camroha,+uttar+pradesh&visual_refresh=true";- 724 Posts
- 3 Reply Likes
and thank u 100000000000x
- 724 Posts
- 3 Reply Likes
Sorry again m here with small problems:(
see i am using this code to reload map manually,
$("#mapreload").click( function()
{
$("#mapholder").html("<img src='"+img_url+"'>");
}
);
But map is not reloading.
- 724 Posts
- 3 Reply Likes
This is img_url variable:
var img_url = "http://maps.googleapis.com/maps/api/staticmap?mytimestamp="+new Date().getTime()
+"¢er="+latlon
+"&zoom=18&size=220x220&sensor=false&markers="+latlon
+"&size:mid%7Ccolor:0xff0000%7Clabel:%7Camroha,+uttar+pradesh&visual_refresh=true";
if i am using, text It's showing on
<div id=mapholder>..</div> but url image not.Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
And since you said the reload "doesn't work", I assume you tested reloading the image. So, you must have had several values for img_url, and I asked you to post those values.
- 724 Posts
- 3 Reply Likes
the real value after page reload are:
http://maps.googleapis.com/maps/api/staticmap?mytimestamp=1464335627401¢er=28.3670355,79.4304381&zoom=18&size=220x220&sensor=false&markers=28.3670355,79.4304381&size:mid%7Ccolor:0xff0000%7Clabel:%7Camroha,+uttar+pradesh&visual_refresh=true
http://maps.googleapis.com/maps/api/staticmap?mytimestamp=1464335815367¢er=28.3670355,79.4304381&zoom=18&size=220x220&sensor=false&markers=28.3670355,79.4304381&size:mid%7Ccolor:0xff0000%7Clabel:%7Camroha,+uttar+pradesh&visual_refresh=true
http://maps.googleapis.com/maps/api/staticmap?mytimestamp=1464335913970¢er=28.3670355,79.4304381&zoom=18&size=220x220&sensor=false&markers=28.3670355,79.4304381&size:mid%7Ccolor:0xff0000%7Clabel:%7Camroha,+uttar+pradesh&visual_refresh=truePetra V., Champion
- 7794 Posts
- 1391 Reply Likes
- 724 Posts
- 3 Reply Likes
Because page reloading it's taking time and when image clicking it's seems like image is dead.
also when i am showing an alert before image reload it's showing alert, but when i coded alert after image reload, it''s not showing.
$("#mapreload").click( function()
{
alert("image is near about to load");
$("#mapholder").html("<img src='"+img_url+"'>");
alert("image reloaded");
}
);
- 724 Posts
- 3 Reply Likes
- 724 Posts
- 3 Reply Likes
1.
http://maps.googleapis.com/maps/api/s...?
mytimestamp=1464347886679¢er=28.3670355,79.4304381&zoom=18&size=220x220&sensor=false&markers=28.3670355,79.4304381&size:mid%7Ccolor:0xff0000%7Clabel:%7Camroha,+uttar+pradesh&visual_refresh=true
2.
http://maps.googleapis.com/maps/api/s...
3.
http://maps.googleapis.com/maps/api/s...

Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
$("#mapholder").html("<img src='"+img_url+"'>");
You are not reloading the image. You are setting a new content value for the #mapholder element.
Instead, you should change the src attribute of the image.
Also, I'm not sure how you want to SEE any changes in the image if you're not going out and walk a mile, or so.
- 724 Posts
- 3 Reply Likes
-I just wan't that if Post Complaint page is already opened and user walk a mile, then now he want to file a complaint but image is showing old location which is a mile far. Now he want to reload only image not whole page, because he filledout some fields, he want to reload only current location. If he will tap reload image, so current location can be show in mapholder.
- 724 Posts
- 3 Reply Likes
Now I gonna some test, I will report u later.
- 724 Posts
- 3 Reply Likes
It's taking too much time to load.
Did you try and find out what is taking so long? Is it the getCurrentPosition call, or is it loading the graphic?
I checked to create an small app.
-To find out that it's graphic loading late or getCurrentPosition call,
So I create an small app: with this script:
<script>
$(document).ready(function() {
var x = $('p');
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition, showError);
}
else {
$("p").text("Geolocation is not supported by this browser.");
}
function showPosition(position) {
var latlon = position.coords.latitude + "," + position.coords.longitude;
var img_url = "http://maps.googleapis.com/maps/api/staticmap?mytimestamp="+new Date().getTime()
+"¢er="+latlon
+"&zoom=18&size=220x220&sensor=false&markers="+latlon
+"&size:mid%7Ccolor:0xff0000%7Clabel:%7Camroha,+uttar+pradesh&visual_refresh=true";
$("#mapholder").html("<img src='"+img_url+"'>");
$("#latlon").text("Current lat and lon values are"+latlon);
}
function showError(error) {
switch(error.code) {
case error.PERMISSION_DENIED:
$("p").text("User denied the request for Geolocation.");
break;
case error.POSITION_UNAVAILABLE:
$("p").text("Location information is unavailable.");
break;
case error.TIMEOUT:
$("p").text("The request to get user location timed out");
break;
case error.UNKNOWN_ERROR:
$("p").text("An unknown error occurred.");
break;
}
}
});
</script>
So I found that graphic is not taking long time, after a 8 or 10 mins delay its showing latlon values and after 1 sec graphic is loading quickly.
This means that the plugin is responding late not the graphic?, now what i do?
see snap shots

Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
Because you still don't use the options parameter for the getCurrentPosition call, you don't make use of cached locations. Also, you're not making use of GPS
- 724 Posts
- 3 Reply Likes
var options = { timeout: 31000, enableHighAccuracy: true, maximumAge: 90000 };
navigator.geolocation.getCurrentPosition(onSuccess, onError, options);
This call back is correct? Can i use it?
you don't make use of cached locations.
How?
Also, you're not making use of GPS
How?
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
Just start with, say, 5000. Adjust if necessary.
Test with multiple devices and multiple OS versions, not just with one device.
- 724 Posts
- 3 Reply Likes
<plugin name="cordova-plugin-x-socialsharing"/>
Plugin:
<script>
$(document).ready(function() {
$('#sharebutton').click(function(){
window.plugins.socialsharing.share(null, null, null, 'https://build.phonegap.com/apps/1899291/install/AjQTHjhXsjgwNqEWsD8h');
});
});
</script>
- 724 Posts
- 3 Reply Likes
And when i restarted the device, It's showing under 10 seconds.
Please Please Please explain me your this two points, what I am missing?
1. you don't make use of cached locations.
2. Also, you're not making use of GPS
a lots of thanks in advance.
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
- 724 Posts
- 3 Reply Likes
<plugin name="cordova-plugin-x-socialsharing"/>Plugin:
<script>
$(document).ready(function() {
$('#sharebutton').click(function(){
window.plugins.socialsharing.share(null, null, null, 'https://build.phonegap.com/apps/1899291/install/AjQTHjhXsjgwNqEWsD8h');
});
});
</script>
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
WHAT is 'not working'?
- the build fails with that code
- the app doesn't install
- the app doesn't launch
- you get an error message
- you receive unexpected results
- your device explodes
- 724 Posts
- 3 Reply Likes
I mean to ask:
When i am clicking "Share button", it's not launching share list, since I changed the plugin cordova-plugin-socialsharing to cordova-plugin-x-socialsharing.
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
In this case, there are several possibilities, looking at your code:
1. The statement
$(document).ready() is not reached
2. The statement
$('#sharebutton').click() is not reached
3. The anonymous
function(){} is not executed
4.
window.plugin or
window.plugins.socialsharing or
window.plugins.socialsharing.share()
doesn't exist (= object type value is 'undefined')
Which one holds true for your app?
Once you find the exact spot of failure, your second step would be to try and find what is causing that.
And thirdly, once you have found the cause, remove it.
- 724 Posts
- 3 Reply Likes
and yes, I am finding now causes to remove them.
- 724 Posts
- 3 Reply Likes
Actually since I used offline page navigation during offline state:
There is a small problem I recognized. I am trying to make you understand by my words if I could.
These were three events, I was handling at "Post Complaint" page load.
1. online
2. offline
&
3. onDeviceready
The offline & onDeviceready are working fine as I expected.
-- When initially device is online, after loading Post Complaint Page, if device is going offline, it's showing offline page and at online state it's going back to the Post Complaint page.(Which is previously loaded).
BUT
--Now problem is that. When device is initially offline, and we tapped to the option Post Complain, it's showing offline page, and if we are coming online, it's going back to the Post Complain page, which is not loaded completely yet. Means we can't access and map and also may be dynamic picklist.
--in another words, at online state Post Complaint page is not reloading, so we can't access map and another dynamic data.
I hope i was successful to make u understand, but i really i dont know how i can define these in words::::::::(
I will be highly thankful, need for suggestion.
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
When device is initially offline, and we tapped to the option Post Complain, it's showing offline page, and if we are coming online, it's going back to the Post Complain page, which is not loaded completely yet. Means we can't access and map and also may be dynamic picklist.Well, actually it should load again correctly when you return to that page, unless you coded something which prevents that.
Your solutions can be:
- either find out why the page doesn't load properly upon return, and correct that
- or don't even go to that page when the device is offline. You could catch the click event on the hyperlink to Complaint.html, check for connection, and either send the user to the Complaint page (if connection is ON) or to the offline page (if OFF).
- 724 Posts
- 3 Reply Likes
Your solutions can be:
- either find out why the page doesn't load properly upon return, and correct that
This is fact that the map and picklist can't be load untill page is offline. The Post Complaint page is loading of course, but offline. So that when we are coming back on this page it's still offline, It must be reloaded right, coz state is changed now? It's now online, It must be fetch data from servers?
I think it's just asking for reload when state is changing into Online.
So is there any way to reload the previous page after
$.mobile.back().Call?
function onOnline() {
// Only go back if user went to offline.html
if ($.mobile.activePage[0].baseURI.indexOf("offline.html") > -1) {
$.mobile.back();
}
}
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
So is there any way to reload the previous pageIt should do so already, unless you are deliberately preventing it with some code.
- 724 Posts
- 3 Reply Likes
We want page reload to fetch details from Internet, if it's going from offline state to online state.
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
- 724 Posts
- 3 Reply Likes
- 724 Posts
- 3 Reply Likes
Also I set timeout:20000, but after 20 sec. too it's not loading and showing "The request is timeout". 2/10 showing map.
-On 2G network static map isn't showing.
-3G and above it's showing but sometime with late processing.
what i do sir.
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
If the map displays almost immediately, the delay is most likely not there.
- 724 Posts
- 3 Reply Likes
I checked as u said at mobile browser it's taking less time to load the image. Near about 4 or 5 seconds, sometime more less.
Then what I am doing mistake.
Only app not showing, just showing request time out. AT good network too .
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
Fetching the map?
- 724 Posts
- 3 Reply Likes
and when time passed e.g. 20 sec, It's show message: "The user request to find out location is timed out".
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
You haven't even constructed the image url at that point!
- 724 Posts
- 3 Reply Likes
You haven't even constructed the image url at that point!
Everything i showed u up, the script, the deviceready events, everything, then where i did mistake?
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
I replied: "I don't think the problem is fetching the map. Try in a browser"
You did, and the problem is not fetching the map, since it got through quickly enough.
Now, you said the process timed out while getting a position.
You need that location to construct the map url, right? So the problem can never have been the map download, because you haven't even been able to construct its url.
See?
Now, you need to find out why it takes so long to get the location coordinates. Possibilities are:
- the device doesn't play well. Try other devices
- you only switch on GPS when the position is needed, and the device isn't getting enough satellite fixes quickly enough
- while the device is getting location, it is simultaneously trying to perform many other tasks
- you aren't outdoors (I hope you were smart enough not to test inside a steel building or so)
- 724 Posts
- 3 Reply Likes
And what can be problem in to image url construction, when it's loading on PC clearly/Instantly and everytime, whenever i am realoding. And also in the mobile too, when i rebuild the app with timeout option. It was showing map, that day I tried many time many where.
Whenever I rebuild it works fine, after sometime again It's unable to find out the location.:( I just smile when I rebuild app with new options and now m crying since it's not finding gps.
Now, you need to find out why it takes so long to get the location coordinates. Possibilities are:
- the device doesn't play well. Try other devices
I tried at many devices, same problem occurring.
- you only switch on GPS when the position is needed, and the device isn't getting enough satellite fixes quickly enough.
Since I start to use static map, GPS is continuously on, even at another devices too, first I swtch GPS on then Install the app.
- while the device is getting location, it is simultaneously trying to perform many other tasks
Can be Possible
- you aren't outdoors (I hope you were smart enough not to test inside a steel building or so)
Petra, i am not small child, i know signals can't be reached in underground or glass and steel :(
- 724 Posts
- 3 Reply Likes
I want to ask few questions, Sir Please reply if have sufficient time.
Q1. Are cordova.js and phonegap,js same?
Q2. In JQuery Mobile page, where we should I place my custom scripts? in head section or at the bottom of page?
Q3. Does GPS need internet connection to receive satellite messages.?
Thank you
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
Q1. Are cordova.js and phonegap,js same?They are not. Especially in case of multiple html documents in an app, of which some are in subdirectories, you should use cordova.js, not phonegap.js.
However, since you are using jQM and thus have a one-page architecture, you can pick either one.
Q2. In JQuery Mobile page, where we should I place my custom scripts? in head section or at the bottom of page?jQuery Mobile implements a one-page architecture. That means that only the head section of the first page is loaded. That's where your general custom script file references go.
You could still include custom scripts in separate other html documents, but they should be (anywhere) in the body part.
Of course, if those scripts manipulate the DOM, you should make sure that the DOM is available before executing such script.
Q3. Does GPS need internet connection to receive satellite messages.?No (otherwise, dedicated mobile GPS devices could never work).
- 724 Posts
- 3 Reply Likes
Related Categories
-
PhoneGap Build
- 15111 Conversations
- 275 Followers
-
Plugins
- 1283 Conversations
- 38 Followers

