Q :ต้องการให้แผนที่เปลี่ยนตำแหน่งตามจังหวัดต้นทางและจังหวัดปลายทางที่ผู้ใช้เลือกใน listbox ใน joomla

ถามตอบ ปัญหาการพัฒนา Extension ไม่ว่าจะเป็น Module plugin Component หรือ แม้แต่ template การปรับแต่งโค้ด Joomla ต่างๆ ทุกเวอร์ชั่น 1.5 2.5 หรือ 3.x

Moderator: mindphp, ผู้ดูแลกระดาน

ภาพประจำตัวสมาชิก
Parichat
PHP VIP Members
PHP VIP Members
โพสต์: 1611
ลงทะเบียนเมื่อ: 08/01/2018 10:03 am

Q :ต้องการให้แผนที่เปลี่ยนตำแหน่งตามจังหวัดต้นทางและจังหวัดปลายทางที่ผู้ใช้เลือกใน listbox ใน joomla

โพสต์โดย Parichat » 23/02/2018 4:46 pm

หนูทำเครื่องมือคำนวนระยะทางด้วย joomla
โดยตอนนี้เขียนให้แผนที่ออกมาแสดงได้แล้วแต่ยังฟิคจังหวัดต้นทางและปลายทางอยู่อีก ดังรูป
ee3.png
ee3.png (132.54 KiB) เปิดดู 491 ครั้ง


โค้ดที่เขียนไว้

โค้ด: เลือกทั้งหมด

<iframe src="https://www.google.com/maps/embed?pb=!1m28!1m12!1m3!1d4011479.531507947!2d97.39775555036944!3d10.928546677130226!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!4m13!3e0!4m5!1s0x311d6032280d61f3%3A0x10100b25de24820!2z4LiB4Lij4Li44LiH4LmA4LiX4Lie4Lih4Lir4Liy4LiZ4LiE4Lij!3m2!1d13.7563309!2d100.5017651!4m5!1s0x30518d792d7f9309%3A0x10223bc2c364c90!2z4LiB4Lij4Liw4Lia4Li14LmI!3m2!1d8.0862997!2d98.9062835!5e0!3m2!1sth!2sth!4v1518766974656" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>


ทำยังไงให้ตำแหน่งในแผนที่เปลี่ยนตามจังหวัดต้นทางและปลายทางคาบ
Live Simply, Laugh Often, Love Deeply.....



ภาพประจำตัวสมาชิก
Parichat
PHP VIP Members
PHP VIP Members
โพสต์: 1611
ลงทะเบียนเมื่อ: 08/01/2018 10:03 am

Re: Q :ต้องการให้แผนที่เปลี่ยนตำแหน่งตามจังหวัดต้นทางและจังหวัดปลายทางที่ผู้ใช้เลือกใน listbox ใน joomla

โพสต์โดย Parichat » 26/02/2018 4:51 pm

หนูลองเอามาดัดแปลแล้วแต่ไม่แสดงอะไรเลยค่ะ

โค้ด: เลือกทั้งหมด

<div id="map" style="width:800px;height:600px;background:#4ba123"></div>

        <script>
            function initMap() {
        var directionsService = new google.maps.DirectionsService;
        var directionsDisplay = new google.maps.DirectionsRenderer;
        var map = new google.maps.Map(document.getElementById('map'), {
          zoom: 7,
          center: {lat: 41.85, lng: -87.65}
        });
        directionsDisplay.setMap(map);

        var onChangeHandler = function() {
          calculateAndDisplayRoute(directionsService, directionsDisplay);
        };
        document.getElementById(<?php $this->province[$this->get->get('i')][$provinthen];?>).addEventListener('change', onChangeHandler);
        document.getElementById(<?php $$this->province[$this->get->get('e')][$provinthen];?>).addEventListener('change', onChangeHandler);
      }

      function calculateAndDisplayRoute(directionsService, directionsDisplay) {
        directionsService.route({
          origin: document.getElementById(<?php $this->province[$this->get->get('i')][$provinthen];?>).value,
          destination: document.getElementById(<?php $this->province[$this->get->get('e')][$provinthen];?>).value,
          travelMode: 'DRIVING'
        }, function(response, status) {
          if (status === 'OK') {
            directionsDisplay.setDirections(response);
          } else {
            window.alert('Directions request failed due to ' + status);
          }
        });
      }
        </script>

        <script src="https://maps.googleapis.com/maps/api/js?key=Key google api&callback=myMap"></script>
Live Simply, Laugh Often, Love Deeply.....

ภาพประจำตัวสมาชิก
tsukasaz
PHP VIP Members
PHP VIP Members
โพสต์: 8258
ลงทะเบียนเมื่อ: 18/04/2012 9:39 am

Re: Q :ต้องการให้แผนที่เปลี่ยนตำแหน่งตามจังหวัดต้นทางและจังหวัดปลายทางที่ผู้ใช้เลือกใน listbox ใน joomla

โพสต์โดย tsukasaz » 26/02/2018 4:53 pm

ลองดูใน console ของ browser กด F12
The last bug isn't fixed until the last user is dead. (Sidney Markowitz, 1995)

ภาพประจำตัวสมาชิก
Parichat
PHP VIP Members
PHP VIP Members
โพสต์: 1611
ลงทะเบียนเมื่อ: 08/01/2018 10:03 am

Re: Q :ต้องการให้แผนที่เปลี่ยนตำแหน่งตามจังหวัดต้นทางและจังหวัดปลายทางที่ผู้ใช้เลือกใน listbox ใน joomla

โพสต์โดย Parichat » 26/02/2018 5:00 pm

tsukasaz เขียน:ลองดูใน console ของ browser กด F12


z8.png
Live Simply, Laugh Often, Love Deeply.....

ภาพประจำตัวสมาชิก
tsukasaz
PHP VIP Members
PHP VIP Members
โพสต์: 8258
ลงทะเบียนเมื่อ: 18/04/2012 9:39 am

Re: Q :ต้องการให้แผนที่เปลี่ยนตำแหน่งตามจังหวัดต้นทางและจังหวัดปลายทางที่ผู้ใช้เลือกใน listbox ใน joomla

โพสต์โดย tsukasaz » 26/02/2018 5:29 pm

โค้ด: เลือกทั้งหมด

<script src="https://maps.googleapis.com/maps/api/js?key=Key google api&callback=myMap"></script>


อ่านบรรทัดบน ต้องเอา key ของ api มาใส่ครับ

ทำตามขึ้นตอน https://developers.google.com/maps/docu ... et-api-key
The last bug isn't fixed until the last user is dead. (Sidney Markowitz, 1995)

ภาพประจำตัวสมาชิก
Parichat
PHP VIP Members
PHP VIP Members
โพสต์: 1611
ลงทะเบียนเมื่อ: 08/01/2018 10:03 am

Re: Q :ต้องการให้แผนที่เปลี่ยนตำแหน่งตามจังหวัดต้นทางและจังหวัดปลายทางที่ผู้ใช้เลือกใน listbox ใน joomla

โพสต์โดย Parichat » 26/02/2018 5:39 pm

tsukasaz เขียน:

โค้ด: เลือกทั้งหมด

<script src="https://maps.googleapis.com/maps/api/js?key=Key google api&callback=myMap"></script>


อ่านบรรทัดบน ต้องเอา key ของ api มาใส่ครับ

ทำตามขึ้นตอน https://developers.google.com/maps/docu ... et-api-key


key google API หนูใส่ไปแล้วคาบ

โค้ด: เลือกทั้งหมด

<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAvl1_oma2NgZFoRBeoM6sf_nsZj2gViHo&callback=myMap"></script>


แต่ตรงฟังก์ชันใน script น่าจะใส่ผิด

โค้ด: เลือกทั้งหมด

<script>
            function initMap() {
                var directionsService = new google.maps.DirectionsService;
                var directionsDisplay = new google.maps.DirectionsRenderer;
                var map = new google.maps.Map(document.getElementById('map'), {
                    zoom: 7,
                    center: {lat: 13.7234186, lng: 100.4762319}
                });
                directionsDisplay.setMap(map);

                var onChangeHandler = function () {
                    calculateAndDisplayRoute(directionsService, directionsDisplay);
                };
                //เอาไอดีของ listbox จังหวัดต้นทางมา
                document.getElementById('i').addEventListener('change', onChangeHandler);
                //เอาไอดีของ listbox จังหวัดปลายทางมา
                document.getElementById('e').addEventListener('change', onChangeHandler);
            }

            function calculateAndDisplayRoute(directionsService, directionsDisplay) {
                directionsService.route({
                    origin: document.getElementById('i').value,
                    destination: document.getElementById('e').value,
                    travelMode: 'DRIVING'
                }, function (response, status) {
                    if (status === 'OK') {
                        directionsDisplay.setDirections(response);
                    } else {
                        window.alert('Directions request failed due to ' + status);
                    }
                });
            }
        </script>
Live Simply, Laugh Often, Love Deeply.....


  • Similar Topics
    ตอบกลับ
    แสดง
    โพสต์ล่าสุด

ย้อนกลับไปยัง

ผู้ใช้งานขณะนี้

กำลังดูบอร์ดนี้: 4 และ บุคคลทั่วไป 0 ท่าน