google maps อัพขึ้นserver คลิกแล้วไตเติลไม่แสดง แต่รันบนเครื่องกดได้ แก้ไขยังไงคะ

ถาม-ตอบ แนะนำไอเดียว โค้ดตัวอย่าง แนวทาง วิธีแก้ปัญหา google maps อัพขึ้นserver คลิกแล้วไตเติลไม่แสดง แต่รันบนเครื่องกดได้ แก้ไขยังไงคะ

http://saladlovers.net/mobile/findstore.html

<!DOCTYPE HTML>
<!--
	Intensify by TEMPLATED
	templated.co @templatedco
	Released for free under the Creative Commons Attribution 3.0 license (templated.co/license)
-->
<html>
	<head>
		<title>Salad Lovers</title>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1" />
		<link rel="stylesheet" href="assets/css/findstore.css" />
  </head>
 
 
 
 <body class="bodyload">

	<!-- Header -->
		<header id="header">
			<nav class="left">
				<a href="main.html" class="back">< Back</a>
				</nav>
				<a href="index.html" class="logo">Salad Lovers</a>
			</header>
          
<br>
<br>   
<header class="major">
	<h2 style="margin-left:25px">Find Store</h2>
	</header>
		
     <div id="map" style="border: 2px solid #3872ac;"></div>
   
   
   
   
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js"></script>
   <script type="text/javascript">

    var map;
var icon = "http://saladlovers.net/mobile/images/mark.png";
var json = "http://saladlovers.net/mobile/connect/test.php";
var infowindow = new google.maps.InfoWindow();

function initialize() {

    var mapProp = {
        center: new google.maps.LatLng(13.728363,100.533534), //LLANDRINDOD WELLS
        zoom: 12,
        styles: [
  {
    "elementType": "geometry",
    "stylers": [
      {
        "color": "#212121"
      }
    ]
  },
  {
    "elementType": "labels.icon",
    "stylers": [
      {
        "visibility": "off"
      }
    ]
  },
  {
    "elementType": "labels.text.fill",
    "stylers": [
      {
        "color": "#757575"
      }
    ]
  },
  {
    "elementType": "labels.text.stroke",
    "stylers": [
      {
        "color": "#212121"
      }
    ]
  },
  {
    "featureType": "administrative",
    "elementType": "geometry",
    "stylers": [
      {
        "color": "#757575"
      }
    ]
  },
  {
    "featureType": "administrative.country",
    "elementType": "labels.text.fill",
    "stylers": [
      {
        "color": "#9e9e9e"
      }
    ]
  },
  {
    "featureType": "administrative.land_parcel",
    "stylers": [
      {
        "visibility": "off"
      }
    ]
  },
  {
    "featureType": "administrative.locality",
    "elementType": "labels.text.fill",
    "stylers": [
      {
        "color": "#bdbdbd"
      }
    ]
  },
  {
    "featureType": "poi",
    "elementType": "labels.text.fill",
    "stylers": [
      {
        "color": "#757575"
      }
    ]
  },
  {
    "featureType": "poi.park",
    "elementType": "geometry",
    "stylers": [
      {
        "color": "#181818"
      }
    ]
  },
  {
    "featureType": "poi.park",
    "elementType": "labels.text.fill",
    "stylers": [
      {
        "color": "#616161"
      }
    ]
  },
  {
    "featureType": "poi.park",
    "elementType": "labels.text.stroke",
    "stylers": [
      {
        "color": "#1b1b1b"
      }
    ]
  },
  {
    "featureType": "road",
    "elementType": "geometry.fill",
    "stylers": [
      {
        "color": "#2c2c2c"
      }
    ]
  },
  {
    "featureType": "road",
    "elementType": "labels.text.fill",
    "stylers": [
      {
        "color": "#8a8a8a"
      }
    ]
  },
  {
    "featureType": "road.arterial",
    "elementType": "geometry",
    "stylers": [
      {
        "color": "#373737"
      }
    ]
  },
  {
    "featureType": "road.highway",
    "elementType": "geometry",
    "stylers": [
      {
        "color": "#3c3c3c"
      }
    ]
  },
  {
    "featureType": "road.highway.controlled_access",
    "elementType": "geometry",
    "stylers": [
      {
        "color": "#4e4e4e"
      }
    ]
  },
  {
    "featureType": "road.local",
    "elementType": "labels.text.fill",
    "stylers": [
      {
        "color": "#616161"
      }
    ]
  },
  {
    "featureType": "transit",
    "elementType": "labels.text.fill",
    "stylers": [
      {
        "color": "#757575"
      }
    ]
  },
  {
    "featureType": "water",
    "elementType": "geometry",
    "stylers": [
      {
        "color": "#000000"
      }
    ]
  },
  {
    "featureType": "water",
    "elementType": "labels.text.fill",
    "stylers": [
      {
        "color": "#3d3d3d"
      }
    ]
  }
]
    };

    map = new google.maps.Map(document.getElementById("map"), mapProp);

     $.getJSON(json, function(json1) {
    /*var json1 = {
        "universities": [
            {
                "title": "Aberystwyth University",
                "website": "www.aber.ac.uk",
                "phone": "+44 (0)1970 623 111",
                "lat": 52.415524,
                "lng": -4.063066},
            {
                "title": "Bangor University",
                "website": "www.bangor.ac.uk",
                "phone": "+44 (0)1248 351 151",
                "lat": 53.229520,
                "lng": -4.129987},
            {
                "title": "Cardiff Metropolitan University",
                "website": "www.cardiffmet.ac.uk",
                "phone": "+44 (0)2920 416 138",
                "lat": 51.482708,
                "lng": -3.165881}
        ]
    };*/
	 
    $.each(json1, function (key, data) {

        var latLng = new google.maps.LatLng(data.lat, data.lng);

        var marker = new google.maps.Marker({
            position: latLng,
            map: map,
            icon: icon,
            title: data.title
        });

        var details = "Branch : " + data.title;

        bindInfoWindow(marker, map, infowindow, details);

            });

    });

}

function bindInfoWindow(marker, map, infowindow, strDescription) {
    google.maps.event.addListener(marker, 'click', function () {
        infowindow.setContent(strDescription);
        infowindow.open(map, marker);
    });
}

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

</script>
        
<script src="//maps.googleapis.com/maps/api/js?v=3.exp&sensor=true&libraries=places&key=AIzaSyBKbfJop0Pi0IiG7H61uyadVK6P8pOXuOY" async defer type="text/javascript"></script>    
  </body>
</html>

AumeBun Kumruck 27.145.136.xxx 06-12-2016 11:50:41

คำแนะนำ และการใช้งาน

สมาชิก กรุณา ล็อกอินเข้าระบบ เพื่อตั้งคำถามใหม่ หรือ ตอบคำถาม สมาชิกใหม่ สมัครสมาชิกได้ที่ สมัครสมาชิก

ถาม-ตอบ กรุณา ล็อกอินเข้าระบบ
User

Pass

Code
เปลี่ยน

จำข้อมูลการล็อกอิน
เข้าระบบอัตโนมัติ

( หรือ เข้าใช้งานผ่าน Social Login )

ล็อกอินด้วย Line

ล็อกอินด้วย Google

ล็อกอินด้วย Twitter

ล็อกอินด้วย Tiktok

ความคิดเห็นที่ 1

มีการเรียกไฟล์ google map javascript ซ้ำ บรรทัดนี้เอาออก

<script src="https://maps.googleapis.com/maps/api/js"></script>

และก็ลองใช้ console เช็ค error javascript ดูได้ที่บทความ

การใช้งาน console log เพื่อ debug javascript ใน chrome firefox และ ie

https://www.ninenik.com/content.php?arti_id=692 via @ninenik

ninenik 14.207.197.xxx 06-12-2016

ขอบคุณทุกการสนับสนุน

สนับสนุนเว็บไซต์เรา จ่ายด้วย Truemoney Wallet

20 บาท 50 บาท 100 บาท 300 บาท หรือ ระบุจำนวน