InvalidValueError บน google map platform แก้อย่างไร

ถาม-ตอบ แนะนำไอเดียว โค้ดตัวอย่าง แนวทาง วิธีแก้ปัญหา InvalidValueError บน google map platform แก้อย่างไร

InvalidValueError บน google map platform แก้อย่างไร
  
สวัสดีค่ะ พอดีหนูกำลังโปรเจคเรื่อง gps tracking โดยการดึงข้อมูลแบบ realtime จาก firbase database โดยจะเอาขึ้นกับ googla map platform หรือ google map api โดยหนูจะต้องแสดงจุดตำแหน่งของรถแบบ realtime แต่ว่าตอนที่กำลัง track เพื่อดูตำแหน่งรถ  ดันเกิด error ตัวนี้ก่อน พยายามแก้ไขยังไงก็ไม่ได้ ช่วยแนะนำหน่อยได้มั้ยคะ ว่าต้องทำยังไง ขอบคุณล่วงหน้าค่ะ 
  
!-- The core Firebase JS SDK is always required and must be listed first -->
    <script src="https://www.gstatic.com/firebasejs/7.6.1/firebase-app.js"></script>

    <!-- TODO: Add SDKs for Firebase products that you want to use
        https://firebase.google.com/docs/web/setup#available-libraries -->
    <script src="https://www.gstatic.com/firebasejs/7.6.1/firebase-analytics.js"></script>
    <script src="https://www.gstatic.com/firebasejs/7.6.0/firebase-database.js"></script>

    <script>
    // Your web app's Firebase configuration
    var firebaseConfig = {
        apiKey: "AIzaSyCXYE4fp1gx0bPQXJbokpmO0eNBAwpaXCY",
        authDomain: "trackbus-fb460.firebaseapp.com",
        databaseURL: "https://trackbus-fb460.firebaseio.com",
        projectId: "trackbus-fb460",
        storageBucket: "trackbus-fb460.appspot.com",
        messagingSenderId: "492399221979",
        appId: "1:492399221979:web:5a58271e44c1be44fe80fe",
        measurementId: "G-ED07MB2GKP"
    };
    // Initialize Firebase
        firebase.initializeApp(firebaseConfig);
        firebase.analytics();
</script>   

<script>
          var locations = [
          ['อาคารเรียนรวม1', 14.882821, 102.016159],
          ['อาคารเรียนรวม2', 14.881804, 102.014075 ],
          ['บขส.มอ', 14.877338, 102.022039 ],
          ['บรรณสาร', 14.877966, 102.014905 ],
          ['ส่วนกิจใหม่', 14.885597, 102.017975 ],
          ['หอ15', 14.890456, 102.017690 ],
          ['หอ16,หอ18', 14.893423, 102.013587 ],
          ['กาสะลองคำ', 14.896637, 102.012492 ],
          ['หอ13โซนล่าง', 14.899170, 102.011342 ],
          ['หอ13โซนบน', 14.898750, 102.011932 ],
          ['หอ7,8,9,10,11', 14.897586, 102.011095 ],
          ];

          var cars_count = 0;

// markers array to store all the markers, so that we could remove marker when any car goes offline and its data will be remove from realtime database...
          var markers = [];
          var maps;

          function initMap() {
            var mapOptions = {
              center: {lat: 14.889685 , lng: 102.018121},
              zoom: 14.2,
            }

            // mapC = new google.maps.Map(document.getElementById('map'), {
            //         zoom: 16,
            //         center: new google.maps.LatLng(14.889685, 102.018121),
            //         mapTypeId: 'terrain'
            // });
            
            maps = new google.maps.Map(document.getElementById("map"),mapOptions);
            
            var marker, i, info;
            for (i = 0; i < locations.length; i++) {
              marker = new google.maps.Marker({
              position: new google.maps.LatLng(locations[i][1], locations[i][2]),
              map: maps,
              title: locations[i][0],
              icon: "ico/png.png"
             
            });
            info = new google.maps.InfoWindow();
            google.maps.event.addListener(marker, 'click', (function(marker, i) {
              return function() {
                info.setContent(locations[i][0]);
                info.open(maps, marker);
              }
              })
              (marker, i));
              } 
              }

              
            function AddCar(data) {

              console.log(data.val());
              

              var icon = { // car icon
                  path: 'M29.395,0H17.636c-3.117,0-5.643,3.467-5.643,6.584v34.804c0,3.116,2.526,5.644,5.643,5.644h11.759   c3.116,0,5.644-2.527,5.644-5.644V6.584C35.037,3.467,32.511,0,29.395,0z M34.05,14.188v11.665l-2.729,0.351v-4.806L34.05,14.188z    M32.618,10.773c-1.016,3.9-2.219,8.51-2.219,8.51H16.631l-2.222-8.51C14.41,10.773,23.293,7.755,32.618,10.773z M15.741,21.713   v4.492l-2.73-0.349V14.502L15.741,21.713z M13.011,37.938V27.579l2.73,0.343v8.196L13.011,37.938z M14.568,40.882l2.218-3.336   h13.771l2.219,3.336H14.568z M31.321,35.805v-7.872l2.729-0.355v10.048L31.321,35.805',

                  scale: 0.7,
                  fillColor: "#ff0000", //<-- Car Color, you can change it 
                  fillOpacity: 1,
                  strokeWeight: 1,
                  anchor: new google.maps.Point(0, 5),
                  rotation: data.val().angle //<-- Car angle
              };

              var uluru = { lat: data.val().lat, lng: data.val().lng };

              var markerC = new google.maps.Marker({
                  position: uluru,
                  icon: icon,
                  map: maps
              });

              markers[data.key] = markerC; // add marker in the markers array...
              document.getElementById("cars").innerHTML = cars_count;
              }

              // get firebase database reference...
              var cars_Ref = firebase.database().ref();

              // this event will be triggered when a new object will be added in the database...
              cars_Ref.on('child_added', function (data) {
              cars_count++;
              AddCar(data);
              });

              // this event will be triggered on location change of any car...
              cars_Ref.on('child_changed', function (data) {
              markers[data.key].setMap(null);
              AddCar(data);
              });

              // If any car goes offline then this event will get triggered and we'll remove the marker of that car...  
              cars_Ref.on('child_removed', function (data) {
              markers[data.key].setMap(null);
              cars_count--;
              document.getElementById("cars").innerHTML = cars_count;
              });
</script>      


Aungkool 223.205.235.xxx 27-12-2019 13:15:36

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

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


  • ถาม-ตอบ กรุณา ล็อกอินเข้าระบบ
  • เปลี่ยน


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

 ความคิดเห็นที่ 1
ถ้าตาม error แจ้ง คือค่าที่ใช้สำหรับ กำหนด latlng หรือพิกัด ตำแหน่ง เป็นรูปแบบข้อมูลที่ไม่ถูกต้อง
เช่น เขาต้องการเป็นข้อมูลตัวเลข แต่กำหนดเป็นข้อมูลข้อความ สมมติ ค่าจากตัวแปร ที่ใช้เป็น '100'
แต่ค่าต้องการเป็น 100 ดังนั้นเราต้องแปลงข้อความที่เป็นตัวเลข เป็นข้อมูลตัวเลขก่อน เช่น  parseFloat(a);



ninenik 124.120.201.xxx 27-12-2019
 ความคิดเห็นที่ 2
หนูต้องเอาวางไว้ตรงไหนของโค้ดค่ะ


aungkool 223.205.235.xxx 27-12-2019 14:09
 ความคิดเห็นที่ 3
http://niik.in/que_2978_6647 
หนูต้องแก้ไขตรงไหนของโค้ดคะ พอดีหนูไม่รู้ว่ามันดึงค่ามาไม่ได้ หรือเป็นเพราะมัน error ตัว map api


aungkool 223.205.235.xxx 27-12-2019 14:10
 ความคิดเห็นที่ 4
น่าจะต้องเช็คจากการใช้งาน เช่น ค่าถูกส่งมาจริงไหม ข้อมูลถูกต้องไหม เพราะทุกอย่างสัมพันธ์กัน
ที่แนะนำอาจจะไม่ต้องใช้ก็ได้ ถ้าเป็นจากปัญหาอื่นๆ หรือถ้าใช้ก็ใช้กับตัวแปร เช่น parseFloat(locations[i][2]) แนวทางการตรวจสอบก้ประมาณว่า เช็คว่ามีค่าส่งกลับมาหรือไม่
ด้วย conole.log() ดูการทำงาน บรรทัดหรือคำสั่งที่ error ผ่าน console ใน inspector ถ้าค่ามา เช็คต่อว่ารูปแบบข้อมูลถูกต้องไหม 
เช็คต่อว่าเรียกใช้ข้อมูลถูกต้องไหม เช่น อาจจะสมมติตัวแปร แทนการใช้ค่าจริงๆ เพื่อดูผลลัพธ์เป็นส่วนๆ 


บทความแนะนำที่เกี่ยวข้อง
การใช้งาน console log เพื่อ debug javascript ใน chrome firefox และ ieอ่าน 28,077
ninenik 124.120.201.xxx 27-12-2019
1






เว็บไซต์ของเราให้บริการเนื้อหาบทความสำหรับนักพัฒนา โดยพึ่งพารายได้เล็กน้อยจากการแสดงโฆษณา โปรดสนับสนุนเว็บไซต์ของเราด้วยการปิดการใช้งานตัวปิดกั้นโฆษณา (Disable Ads Blocker) ขอบคุณครับ