みんなの「教えて(疑問・質問)」にみんなで「答える」Q&Aコミュニティ

こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

解決済みの質問

JavaScriptが実装できない

初めまして。

Google Maps APIを使ってwebページ上でgoogle mapsを表示させようと思い
htmlファイルとjavascriptファイルを実装したのですがうまく動きません。

ソースコードは以下の通りです。

googlemaps.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style type="text/css">
html, body { height: 100%; }
</style>
<script type="text/javascript"
src="http://maps.google.com/maps/api/js?sensor=false">
</script>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("jquery", "1.5.0");
</script>
<script type="text/javascript" src="googlemaps.js"></script>
<title>指定した位置を中心とする地図</title>
</head>
<body>
<p>
緯度<input id="lat" type="text" value="35.632997" />
経度<input id="lng" type="text" value="139.648609" />
<button id="button">地図を作る</button>
</p>
<div id="map_canvas" style="width: 100%; height: 90%;"></div>
</body>
</html>


googlemaps.js

$(document).ready(function() {
$("#button").click(function() {
// input要素の値を取得し、マップの中心を決める
var lat = $("#lat").val();
var lng = $("#lng").val();
var myCenter = new google.maps.LatLng(lat, lng);

// 地図のオプション
var myOptions = {
zoom : 14,
center : myCenter,
mapTypeId : google.maps.MapTypeId.ROADMAP // 必須
};

// 地図の生成
var myMap = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

// マーカーの生成
new google.maps.Marker( {
position : myCenter,
map : myMap,
title : "Hello World!"
});
});
});


firebugはgooglemaps.js 404 not foundといっているのでhtmlとjavascriptの連携が
うまくいってないのだと思うのですが、どうすればいいのかわからず前にすすめません。
お詳しい方、ご教授ください。

投稿日時 - 2013-03-15 16:13:46

QNo.7994701

困ってます

質問者が選んだベストアンサー

そのままで、一応動作するようです。
(googleのapiでもDOM要素にイベントハンドラのバインドが可能ですので、このため
 だけでしたら、わざわざjQeryを使用しなくてもよさそうには思いますが…)


>firebugはgooglemaps.js 404 not foundといっているので
単純にjsファイルが読み込めていないだけではないでしょうか?
jsファイルをアップし忘れているとか、正しいディレクトリにないなどの可能性が高いと思いますので、そのあたりを再チェックなさるのがよろしいと思います。

投稿日時 - 2013-03-15 17:34:21

補足

動作さますか…

jsファイルをhtmlファイルがあるjavawebフォルダの中に作ったのですが、すべてのファイルが表示されるnetbeansの左の部分に
jsファイルが表示されないのですが、問題ありませんか?

jsファイルをアップするとはどういったことなのでしょうか?

投稿日時 - 2013-03-15 20:24:48

このQ&Aは役に立ちましたか?

0人が「このQ&Aが役に立った」と投票しています

回答(1)

あなたにオススメの質問