Google Map の地図が Chrome では正しく表示されない ( gmap.js 使用)

緯度と経度から現在位置を表示させようとしてGoogle Map を扱いやすくしたライブラリ gmap.jsを称しています。

ところが Github にあったテストコードを使用しても正常に画面上は真っ白で地図どころか何も表示されませんでした。

Firefox だと表示されました。
Chrome だと表示されません。

HTMLとスクリプトはこのようになっています。

<html>
<head>
  <title></title>
  <script src="http://maps.google.com/maps/api/js"></script>
  <script src="https://raw.githubusercontent.com/hpneo/gmaps/master/gmaps.js"></script>
  <style type="text/css">
    #map {
      width: 400px;
      height: 400px;
    }
  </style>
</head>
<body>
  <div id="map"></div>
  <script>
    var map = new GMaps({
      el: '#map',
      lat: -12.043333,
      lng: -77.028333
    });
  </script>
</body>
</html>

コード

行動規範の内容に同意します

回答2件

html
1<html>
2	<head>
3		<title></title>
4		<script src="//maps.google.com/maps/api/js"></script>
5		<script src="//raw.githubusercontent.com/hpneo/gmaps/master/gmaps.js"></script>
6		<style type="text/css">
7			#map {
8				width: 400px;
9				height: 400px;
10			}
11		</style>
12	</head>
13	<body>
14		<div id="map"></div>
15		<script>
16			var map = new GMaps({
17				el: '#map',
18				lat: -12.043333,
19				lng: -77.028333
20			});
21		</script>
22	</body>
23</html>

投稿2016/01/24 06:07

退会済みユーザー

総合スコア0

orikousan

2016/01/24 07:39

行動規範の内容に同意します

自己解決

「GithubにあるJSファイルを直リンクで読込すると「Refused to execute script」と出る件」
http://thr3a.hatenablog.com/entry/20140219/1392804136

<html>
    <head>
        <title></title>
        <script src="http://maps.google.com/maps/api/js"></script>
        <script src="http://rawgithubusercontent.com/hpneo/gmaps/master/gmaps.js"></script>
        <style type="text/css">
            #map {
                width: 400px;
                height: 400px;
            }
        </style>
    </head>
    <body>
        <div id="map"></div>
        <script>
            var map = new GMaps({
                el: '#map',
                lat: -12.043333,
                lng: -77.028333
            });
        </script>
    </body>
</html>

Thank X!!