Keskustelu: Nettisivujen teko: GoogleMaps ongelma

Sanokaas viisaammat. Ongelmana on GoogleMaps center karttapisteen haku nettisivulta.
Alla on kaksi eri versiota määritellä karttapiste. Molemmat tuottavat saman tuloksen (alertilla tulostettuna), mutta vain alempi jossa on osoitetiedot on kirjoitettu koodiin, toimii. Missä vika?

	// THIS NOT WORK
	var osoite = [document.getElementById('kiint_location').value.split(",")];
	// osoite[0][0] , osoite[0][1] = print 60.170000 , 24.940000;

	map = new google.maps.Map(document.getElementById('googleMap'), {
    zoom: 16,
    center: karttaPiste
  });


	// THIS IS OK
	var karttaPiste = {lat: 60.170000 , lng: 24.9410000};
	// print 60.170000 , 24.940000;

  map = new google.maps.Map(document.getElementById('googleMap'), {
    zoom: 16,
    center: karttaPiste
  });

split() palauttaa taulukon, mutta laitat sen vielä taulukkoon, joten tulos taulukko taulukossa. Alemmassa taas on annettu arvoja avaimille. Ei pitäisi tulla läheskään samaa alertilla.

Ensimmäinen koodisi ei voi mitenkään toimia, koska sijoitat arvot muuttujaan ”osoite” mutta käytät pyynnössä muuttujaa ”karttaPiste”.

Vaikka muuttujan nimi olisi oikein, tietenkin tulos on alertilla sama, jos katsot vain numeroita etkä koko rakenteita. Kai nyt järkikin sanoo, että tässä on kaksi ihan eri asiaa:

var osoite = [["60.170000", "24.940000"]];
var karttaPiste = {lat: 60.170000, lng: 24.940000};

Tai ehkä tarkoitit, että olet yrittänyt siirtää lukuja muuttujasta ”osoite” muuttujaan ”karttaPiste”. Tällöin ongelmana voi olla se, että tieto pitäisi itse muuttaa tekstistä luvuiksi esimerkiksi funktiolla parseFloat. (En tiedä, mitä dataa Googlen rajapinta käsittelee.)

Kiitti vinkeistä. Kokeiltu on parseFloat() ja todellakin nuo taulukon arvot jotka tulostuu on viety tuonne karttaPiste muuttujaan.
Minun mielestäni javascript on heikosti tyypitetty joten jos luvut tulostuu samanlaisina niin homman pitäisi toimia myös tässä

var karttaPiste = {lat: taulukko[0][0], lng: taulukko[0][1]};

yhtälössä. Näin ei kuitenkaan käy. Ei siis myöskään parseFloat() muunnoksen jälkeen?

JavaScriptissa arvolla on täysin selvä tyyppi. Koodissa voi tarkistaakin arvon tyypin. Ei ole yhdentekevää, mitä tyyppiä käyttää: esimerkiksi 1+1 on 2 mutta "1"+"1" on "11". Joskus tyypit muuttuvat automaattisesti, mutta läheskään aina muutos ei ole tekstistä luvuksi, vaan esimerkiksi 1+"1" onkin "11".

Etkö nyt oikeasti saa debugattua tuota yksinkertaista koodiasi? Tarkista jokaisen vaiheen jälkeen alertilla tai mieluummin selaimen JavaScript-kehitystyökaluilla, missä muodossa tieto on.

var s = document.getElementById('kiint_location').value;
alert(JSON.stringify(s));
// "60.170000,24.940000"

var t = s.split(",");
alert(JSON.stringify(t));
// ["60.170000","24.940000"]

var piste = {"lat": parseFloat(t[0]), "lng": parseFloat(t[1])};
alert(JSON.stringify(piste));
// {"lat":60.17,"lng":24.94}

Kiitti Metabolix, toimii.