login  Naam:   Wachtwoord: 
Registreer je!
 Forum

jQuery Store Locator toont verkeerde afstand

Offline Schwung - 17/10/2015 18:24 (laatste wijziging 17/10/2015 22:02)
Avatar van SchwungNieuw lid Hi all,

Ik heb onderstaande JS-code toegepast ten behoeve van een store locator.
De store locator geeft een overzicht van shops op basis van reisafstand vanaf locatie.
Zie hier de link naar de demo-page: http://optimax.apphb.com/demo.html

Mijn vraag heeft betrekking op de foutieve weergave van de afstand.

Als je 'London' invoert in het zoekveld dan wordt bij de eerste hit '11 miles' weergegeven, waar dit 1.1 mile zou moeten zijn.
Bij lange afstanden treedt deze fout ook op. Bij een afstand boven de 1000 miles wordt deze door Google-maps weergeven als bijvoorbeeld 1,161 miles terwijl JS 1.161 mile genereert, alsof de afstand dus minder dan 2 mile zou zijn.

Mogelijk verduidelijkt onderstaande mijn vraag:

Voorbeeld A
Daadwerkelijke afstand: 1,1 mile
Notificatie Google: 1.1 mile
JS genereert foutief: 11 miles

Voorbeeld B
Daadwerkelijke afstand: 1161 miles
Notificatie Google: 1,161 miles
JS genereert foutief: 1.161
Gevolg: deze shop wordt als eerste weergeven (alsof de afstand minder dan 2 mile is) in de resultaten, terwijl deze pas achteraan genoemd zou moeten worden.

Wie zou mij kunnen helpen met de aanpassing in waarschijnlijk JS?

Thanks alvast!

Hieronder de JS-code:
Plaatscode: 142479
mod edit: als dit code is van de oorspronkelijke makers en deze is vrij beschikbaar hoef je die hier niet opnieuw te posten. Een link naar de site / het origineel volstaat.

11 antwoorden

Gesponsorde links
Offline Thomas - 17/10/2015 22:07 (laatste wijziging 17/10/2015 22:09)
Avatar van Thomas Moderator Heb je code gewijzigd in het origineel? Ik kan mij niet voorstellen dat hier nog grote fouten in zitten?

Is dit niet gewoon een interpretatie-fout aan jouw zijde?

In de engelse "locale" is een komma een scheidingsteken voor duizendtallen, en een punt geeft het scheidingsteken aan tussen gehele getallen en decimalen.

Bij ons is het juist andersom. (een . als scheidingsteken voor duizendtallen, en een , voor de scheiding tussen geheel en decimaal).

Weet je zeker dat er daardoor geen misverstanden ontstaan? Met enig logisch redeneren had je toch wel een zekere trend kunnen bespeuren in het bovenstaande?

Heb je gekeken of er ergens instellingen verkeerd zijn of dat je mogelijk iets anders fout doet? Waar is de documentatie? Die site is niet bepaald toegankelijk...

Daarnaast: ook een thread geopend op phphulp?
Offline Schwung - 18/10/2015 14:46 (laatste wijziging 18/10/2015 14:50)
Avatar van Schwung Nieuw lid Heel erg bedankt voor de snelle reactie!

Die trend was mij opgevallen. Ik ging ervan uit dat de oplossing gezocht moest worden in een aanpassing van JS, maar nu begrijp ik dat het ook aan bepaalde instellingen zou kunnen liggen. Waar zou ik hierbij aan kunnen denken?

Hierbij ook een link naar de volledige documentatie. Link

De demo-page waar ik in mijn vorige post naar verwees - demo page - is het het origineel, hier is niets aan veranderd.

Als ik op de demo-page Hannover invoer dan wordt 'Optimax Laser Eye Surgery - Aberdeen' als dichtsbijzijndste shop genoemd, terwijl deze het verste weg ligt.

---------

Op deze website heb ik wel zelf enige aanpassingen gedaan. Zo heb ik in JS het volgende veranderd om de afstand te weergeven in kilometers:

unitSystem: google.maps.UnitSystem.IMPERIAL [origineel]
unitSystem: google.maps.UnitSystem.METRIC [ipv het origineel]

Als ik op deze website Eindhoven invoer treden de volgende twee fouten op:
1) Optimax Laser Eye Surgery - Glasgow wordt weer als dichtsbijzijndste resultaat weergeven terwijl deze het verste weg ligt.
2) Men's Suits uit Den Bosch wordt als derde weergeven, terwijl deze winkel het meest in de buurt ligt. In de resultaten bedraagt de afstand 368 km, terwijl dit 36,8 km zou moeten zijn.

---------

De fout zal inderdaad te maken hebben met de verschillende vormen van scheidingstekens. Alleen kom ik er niet uit wat ik waar zou moeten aanpassen.

Verder klopt het inderdaad dat ik ook een thread elders heb geopend. Eerder heb ik nog niet actief deelgenomen aan een forum en ging ervan uit dat het geen probleem is om meerdere threads te openen, omdat mij is opgevallen dat bepaalde vragen op meerdere fora worden gesteld. Uit jouw opmerking denk ik echter impliciet te kunnen afleiden dat dit niet de bedoeling is.

Alvast bedankt!
Offline Thomas - 18/10/2015 16:23
Avatar van Thomas Moderator Dat mag best hoor, zolang je, als het probleem is opgelost, dit maar overal aangeeft. Dat laatste gebeurt lang niet altijd, waarbij je dus nodeloos mensen aan het werk zet of aan het werk laat.

Het wordt ook gewaardeerd dat je -als je dit zelf hebt opgelost of elders is opgelost- aangeeft wat dan de oplossing is, zodat anderen die met soortgelijke problemen kampen hier mogelijk ook iets aan hebben.

---

Om een of andere reden is die Aberdeen winkel ook in Den Bosch gesitueerd ?

Misschien gaat Google er vanuit dat je (toch) in Nederland zit ofzo, indien je een Nederlands adres invult, en dat dan je resultaten beperkt/geinterpreteerd worden als nederlands adresssen?

Daarnaast werkt deze API met rij-afstanden geloof ik, niet met hemelsbrede afstanden.

Waar wordt bepaald welke ooglaser-filialen getoond moeten worden? Mogelijk zitten er fouten/onnauwkeurigheden in je bronmaterial (lat/lon coordinaten)?
Offline Schwung - 18/10/2015 22:14 (laatste wijziging 18/10/2015 22:16)
Avatar van Schwung Nieuw lid Prima, zodra de vraag is beantwoord zal ik dit delen. Helaas ben ik er op dit moment nog niet uit.

Hier het XML bestand met de data die worden gebruikt door de
de demopage.

Op de door mij aangepaste website heb ik ditzelfde XML bestand gebruikt en alleen onderstaande toegevoegd.

php code - Bekijk de code zonder highlighting - Klap code in 
  1. <Placemark>
  2.     <name>Men's Suits</name>
  3.     <Snippet>Men's Suits</Snippet>
  4.     <description><![CDATA[<div dir="ltr">Men's Suits Den Bosch         <br>Verwersstraat 7<br>'s-Hertogenbosch<br>5211 HS<br>0800 093 1110</div>]]></description>
  5.     <Point>
  6.       <coordinates>5.304148,51.687703,0.000000</coordinates>
  7.     </Point>
  8.   </Placemark>


In de handleiding van The Google Maps Distance Matrix API lees ik onderstaande:

Citaat:
Unit Systems

Distance Matrix results contain text within distance fields to indicate the distance of the calculated route. The unit system to use can be specified:

units=metric (default) returns distances in kilometers and meters.
units=imperial returns distances in miles and feet.
* Note: this unit system setting only affects the text displayed within distance fields. The distance fields also contain values which are always expressed in meters.

Vervolgens wordt onderstaande voorbeeld code gegeven:

javascript code - Bekijk de code zonder highlighting - Klap code in 
  1. {
  2.   "status": "OK",
  3.   "origin_addresses": [ "Vancouver, BC, Canada", "Seattle, État de Washington, États-Unis" ],
  4.   "destination_addresses": [ "San Francisco, Californie, États-Unis", "Victoria, BC, Canada" ],
  5.   "rows": [ {
  6.     "elements": [ {
  7.       "status": "OK",
  8.       "duration": {
  9.         "value": 340110,
  10.         "text": "3 jours 22 heures"
  11.       },
  12.       "distance": {
  13.         "value": 1734542,
  14.         "text": "1 735 km"
  15.       }
  16.     }


Waarschijnlijk ligt het antwoord op mijn vraag besloten in de wijze waarop de value wordt weergegeven als text. Maar zeker weten doe ik dat niet. Mogelijk ligt het ergens anders aan.

Hopelijk verduidelijkt bovenstaande mijn vraag.
Wederom alvast bedankt!
Offline Thomas - 19/10/2015 14:11 (laatste wijziging 19/10/2015 14:14)
Avatar van Thomas Moderator Eerste bericht
Als ik op de demo-site http://optimax.apphb.com/demo.html London invoer is mijn dichtstbijzijnde resultaat 1.1 miles (Victoria), op de tweede plaats 2.6 Liverpool Street. Ik zien geen resultaten met hele grote afstanden. Het klinkt in jouw geval alsof JavaScript de betekenis van de punten en komma's verwisselt, dit zou het gedrag wat je ondervindt kunnen verklaren.

De default lat/lon (zie code) is Northhampton, in het midden van Engeland.

De code die je plaatst zijn enkel de definities, maar niet jouw aanroep/initialisatie. Hoe luidt deze? (EDIT: oh, dat ik ook met alle default waarden, je geeft geen afwijkende optie-waarden mee :/)

Daarnaast, in de code staat ook: "Please enter valid UK address address or postcode", wellicht is deze niet geschreven voor buiten UK (althans niet zonder enige aanpassingen)?

Tweede bericht
Als ik op de demo-page Hannover invoer vind ik Maidstone als dichtstbijzijnste filiaal (471 miles).

Als ik op onontdekt.com Eindhoven invoer, is de dichtstbijzijnste store "Jan Aberdeen", er staat weliswaar een adres in Aberdeen, maar de marker bevindt zich in Den Bosch (36.8 km). Ook resultaat #2 (Men's Suits, Den Bosch, 36.8 km) lijkt mij te kloppen? Dit stemt overeen met je stores in data/stores.xml. Je hebt daar voor de store van Aberdeen dezelfde lat/lon ingevuld als de store in Den Bosch.

Ik weet niet of/wat je ondertussen gewijzigd hebt, maar de variant op onontdekt.com lijkt gewoon zijn ding te doen?

Je ontwikkelt hopelijk wel met browsercache uit neem ik aan? Als je veel dingen in JavaScript bestanden wijzigt komen deze wijzigingen niet altijd direct door als je geen harde refreshes doet/cache uit zet.

(Ik neem ook aan dat je niet vergeet je wijzigingen te uploaden voordat je deze test, om nog maar een dwarsstraat te noemen)

Kortom: ik kan op dit moment het gedrag wat jij constateert in je eerste twee berichten niet (meer) reproduceren, ook lijken de afstandsberekeningen op onontdekt.com te kloppen. Spelen er nu nog ergens problemen?
Offline Schwung - 19/10/2015 19:54
Avatar van Schwung Nieuw lid Toen ik vandaag onontdekt.com bezocht via een andere desktop bleek het inderdaad wel te kloppen.

Echter als ik via andere apparaten, zoals laptops en telefoons de website bezoek dan blijven eerder genoemde fouten zich voordoen. Ik heb van beide situaties een print screen gemaakt. Screenshot foutieve en correcte weergave.
Offline Thomas - 19/10/2015 20:02
Avatar van Thomas Moderator Heb je al geprobeerd een refresh te forceren op die apparaten?

Desnoods kun je dit doen door bijvoorbeeld een random hash ofzo achter je js-bestand te zetten, dan denkt je browser dat deze elke keer met een ander bestand van doen heeft. Dit is overigens niet de meest ideale oplossing want dit bestand wordt dan dus nooit gecached - beter is om dit dus op een andere manier op te lossen.
Bedankt door: Schwung
Offline Schwung - 19/10/2015 22:40 (laatste wijziging 21/10/2015 19:48)
Avatar van Schwung Nieuw lid Mogelijk zou een aanpassing in onderstaande code het euvel kunnen verhelpen. Weet iemand wat ik zou kunnen aanpassen?

javascript code - Bekijk de code zonder highlighting - Klap code in 
  1. function GoogleMapDistanceTextToNumber(str) {
  2.                 return Number(str.replace(/[^0-9.]/g, ""));
  3.             }
Offline Thomas - 21/10/2015 21:51
Avatar van Thomas Moderator Dat is een reguliere expressie die alle karakters die geen cijfer 0..9 of punt zijn stript uit de invoer (een afstand).

Het enige wat ik daar aan zou veranderen is dat 'ie komma's ook ontziet, al zie ik niet helemaal hoe dat de werking zou moeten bevorderen. Ik kan mij vergissen, maar volgens mij kan JavaScript daar niet mee rekenen, tenzij dit "locale" strings zijn.

Dus ik zou ofwel /[^0-9.]/ vervangen door /[^0-9.,]/ of het gewoon (en wellicht beter) ongewijzigd laten. Je kunt het natuurlijk altijd proberen...
Offline Schwung - 28/10/2015 19:58 (laatste wijziging 28/10/2015 19:59)
Avatar van Schwung Nieuw lid Als ik de functie aanpas naar onderstaande code dan ontstaan er errors, sommige afstanden worden helemaal niet weergeven.


javascript code - Bekijk de code zonder highlighting - Klap code in 
  1. function GoogleMapDistanceTextToNumber(str) {
  2. str.replace(/[^0-9,.]/g, "")


Als ik de functie met onderstaande code aanpas dan worden de afstanden op de correcte wijze weergeven.

javascript code - Bekijk de code zonder highlighting - Klap code in 
  1. function GoogleMapDistanceTextToNumber(str) {
  2.                 return str;
  3.             }


Alleen wordt een shop met de afstand 1.137 km als dichterbij weergeven als een shop met 36,8 km afstand.
Hier een link naar het screenshot: http://culturerulesthenation.com/Screenshot2.html

Wat zou ik nog moeten aanpassen?
Offline Thomas - 29/10/2015 11:17 (laatste wijziging 29/10/2015 11:18)
Avatar van Thomas Moderator Ik zou in eerste instantie er vanuit gaan dat alle externe code klopt.

Dan zou ik teruggaan naar alle default aangeleverde code. Ik zou dus die UnitSystem terugveranderen naar IMPERIAL. Mogelijk zorgde deze wijziging voor problemen in combinatie met bovengenoemde functie (GoogleMapDistanceTextToNumber).

Kijk of dit dan wel werkt, ook al wordt alles dan weergegeven in mijlen. Als dit werkt dan heb je dus enerzijds (min of meer) getoetst dat de oorspronkelijke code werkt en anderzijds heb je je probleem gereduceerd tot een weergave-kwestie (je wilt kilometers tonen in plaats van mijlen).

Je kunt dan helemaal aan het einde van de rit, nadat de API en alles wat er aan vasthangt zijn werk heeft gedaan, een hulpfunctie aanroepen die in plaats van mijlen kilometers afdrukt (dit zal een simpele omreken-functie zijn).

Als je helemaal aan het einde van dit proces een af te drukken gegeven wijzigt, is de kans dat dit onderweg (tijdens het uitvoeren van berekeningen enzo) op een of andere manier een ongewenste interactie tot gevolg heeft (dit kan een mogelijke oorzaak zijn van de problematiek die je ondervindt) in het geheel afwezig.
Gesponsorde links
Je moet ingelogd zijn om een reactie te kunnen posten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.21s