Kirjautuminen

Haku

Tehtävät

Keskustelu: Nettisivujen teko: Google Maps API v3 -ongelma Operalla

jaketsu [02.03.2014 09:54:33]

#

Esimerkkikoodi kopioitu suoraan osoitteesta https://developers.google.com/maps/documentation/javascript/examples/map-simple. Toimii loistavasti muilla testaamillani selaimilla paitsi Operalla (v. 12.16, Windows 7), joka ei näytä karttaa ollenkaan. Operan työkalujen mukaan ongelmana on rivi

google.maps.event.addDomListener(window, 'load', initialize);

jonka kohdalla Opera ilmoittaa: "Unhandled Error: Cannot convert 'google.maps.event' to object". Tuohan on varmaan jotenkin korjattavissa, koska kartat toimivat Googlen omilla sivuilla myös Operalla. Tietääkö joku tuohon helpohkon korjauksen, vai tulostanko kartan tilalle Operan käyttäjille kehotuksen kokeilla toisella selaimella?

Triton [02.03.2014 11:40:23]

#

Nyt täytyy heti ekaksi varmistaa, että ootko sä varmasti lisännyt googlen apin script-tagien avulla sivulle?

Edit.

Kyllä mulla vaan toimii Operalla tämä:

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title></title>

	<style type="text/css">

		#map-canvas {
			width: 500px;
			height: 300px;
		}

	</style>

	<script type="text/javascript" src="http://www.google.com/jsapi?autoload={'modules':[{name:'maps',version:3,other_params:'sensor=false'}]}"></script>
	<script type="text/javascript">

		function init() {

			var canvas = document.getElementById( 'map-canvas' );

			var map = new google.maps.Map( canvas, {
				zoom: 6,
				center: new google.maps.LatLng( 62, 24 ),
				mapTypeId: google.maps.MapTypeId.ROADMAP
			});

		}

		google.maps.event.addDomListener( window, 'load', init );


	</script>

  </head>

  <body>

	<div id="map-canvas"></div>


  </body>


</html>

Ja jatkossa, jos haluaa tarkemmin saada selville, että mistä mahdollinen vika johtuu, niin kannattaa kyllä laittaa enemmän koodia näkyville. Virhe ei nimittäin ole tuossa rivissa, vaan luultavasti tuossa initialize-metodissa on jokin kirjoitusvirhe yms...

jaketsu [02.03.2014 12:49:33]

#

Niin, se testaamani koodi on siis suora copy-paste ilman mitään muutoksia heti alussa linkittämältäni sivulta. Koodi alla:

<!DOCTYPE html>
<html>
  <head>
    <title>Simple Map</title>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <style>
      html, body, #map-canvas {
        height: 100%;
        margin: 0px;
        padding: 0px
      }
    </style>
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
    <script>
var map;
function initialize() {
  var mapOptions = {
    zoom: 8,
    center: new google.maps.LatLng(-34.397, 150.644)
  };
  map = new google.maps.Map(document.getElementById('map-canvas'),
      mapOptions);
}

google.maps.event.addDomListener(window, 'load', initialize);

    </script>
  </head>
  <body>
    <div id="map-canvas"></div>
  </body>
</html>

Sinun laittamasi koodi kyllä toimii minullakin Operalla, mutta Googlen oma esimerkki ei. Mutta kiitoksia, sillä asia korjautui vaihtamalla Googlen esimerkistä kohta:

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>

sinun esimerkissäsi olevaan muotoon:

<script type="text/javascript" src="http://www.google.com/jsapi?autoload={'modules':[{name:'maps',version:3,other_params:'sensor=false'}]}"></script>

Vastaus

Aihe on jo aika vanha, joten et voi enää vastata siihen.

Tietoa sivustosta