Google API में MySql और PHP से डेटा ले कर कार के बढ़ने पर पॉलीलाइन आरेखण

Question

मैं MySQL और PHP के डेटा लेकर Google मैप पर पॉलीलाइन दिखाना चाहता था, जैसे एनीमेशन के साथ कार चलती है (जैसे इस साइट में: http://econym.org.uk/gmap/example_cartrip2.htm )। उसके लिए मैंने Google एपीआई ट्यूटोरियल पॉलीलाइन से कोड का उल्लेख किया । मैंने अपनी SQL से इसके लिए डेटा भी लिया है जो निम्नानुसार है: .html

function load() {
    var point;
                    var flightPlanCoordinates=new Array();
            var map = new google.maps.Map(document.getElementById("map"), {
                center: new google.maps.LatLng(18.33, 73.55),
                zoom: 7,
                mapTypeId: google.maps.MapTypeId.ROADMAP,
                mapTypeControl: false,
                mapTypeControlOptions: {
                style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR
                 },
                navigationControl: true,
                navigationControlOptions: {
                    style: google.maps.NavigationControlStyle.SMALL
                }
            });

            downloadUrl("xmltry.php", function(data) {
        var xml = data.responseXML;

        var markers = xml.documentElement.getElementsByTagName("marker");
        for (var i = 0; i < markers.length; i++) {
            point = new google.maps.LatLng(
              parseFloat(markers[i].getAttribute("lat")),
              parseFloat(markers[i].getAttribute("lon")));
            flightPlanCoordinates[i]=point;
          }
          var flightPath = new google.maps.Polyline({
    path: flightPlanCoordinates,
    strokeColor: "#FF0000",
    strokeOpacity: 1.0,
    strokeWeight: 2
  });

  flightPath.setMap(map);

      });

        }

        function downloadUrl(url, callback) {
      var request = window.ActiveXObject ?
          new ActiveXObject('Microsoft.XMLHTTP') :
          new XMLHttpRequest;

      request.onreadystatechange = function() {
        if (request.readyState == 4) {
          request.onreadystatechange = doNothing;
          callback(request, request.status);
        }
      };

      request.open('GET', url, true);
      request.send(null);
    }
    function doNothing() {}

.php फ़ाइल:

<?php
//require("phpsqlajax_dbinfo.php");
include 'common_db.inc';
// Start XML file, create parent node

$dom = new DOMDocument("1.0");
$node = $dom->createElement("markers");
$parnode = $dom->appendChild($node); 

// Opens a connection to a MySQL server

$connection=mysql_connect ("$dbserver", "$dbuser", "$dbpass");
if (!$connection) {  die('Not connected : ' . mysql_error());} 

// Set the active MySQL database

$db_selected = mysql_select_db($dbname, $connection);
if (!$db_selected) {
  die ('Can\'t use db : ' . mysql_error());
} 

// Select all the rows in the markers table

$query = "SELECT  `lat`, `lon` FROM current_location Where Device_ID='HGS1005'";
$result = mysql_query($query);
if (!$result) {  
  die('Invalid query: ' . mysql_error());
} 

header("Content-type: text/xml"); 

// Iterate through the rows, adding XML nodes for each

while ($row = @mysql_fetch_assoc($result)){  
  // ADD TO XML DOCUMENT NODE  
  $node = $dom->createElement("marker");  
  $newnode = $parnode->appendChild($node);  
  $newnode->setAttribute("lat", $row['lat']);  
  $newnode->setAttribute("lon", $row['lon']);  
  } 

echo $dom->saveXML();

?>

लेकिन अब मैं 1 संदर्भ साइट में शो के रूप में एनीमेशन के साथ पॉलीलाइन दिखाना चाहता था। कोई भी मुझे कुछ संदर्भ सुझा सकता है या मुझे उसी में मदद कर सकता है। मुझे यह परिणाम मिल रहा है जो सही है लेकिन इसमें http://econym.org.uk/gmap/example_cartrip2.htm जैसा एनिमेशन चाहिए। आशा है कि इस बार मेरा शीर्षक और विवरण भाग समझ में आएगा।

Answer 1

पॉलीलाइन के लिए मैप्स जावास्क्रिप्ट एपीआई डॉक्स से ( pathसंपत्ति पर ध्यान दें ) :

पॉलीलाइन के निर्देशांक का क्रमबद्ध क्रम। इस पथ को या तो लैटीन के एक साधारण सरणी, या LatLngs के MVCArray का उपयोग करके निर्दिष्ट किया जा सकता है। ध्यान दें कि यदि आप एक साधारण सरणी पास करते हैं, तो यह MVCArray में परिवर्तित हो जाएगा या MVCArray में LatLngs को हटाने से स्वचालित रूप से नक्शे पर पॉलीलाइन अपडेट हो जाएगा ।

यह जानते हुए कि, मैं इसे इस तरह आज़माऊँगा:

// I assume you've got your GPS signal pumping updates to your client.
// Insert a new GPS point into your Polyline's point array.
function OnGpsPulse(newLat, newLon)
{
  // Insert a new point at the end of the LatLng Array.
  pointIndex = flightPlanCoordinates.length;      
  flightPlanCoordinates[pointIndex]=new google.maps.LatLng(newLat, newLon);

  // And the line should automatically update in the map.
}

बाद में, प्रत्येक जीपीएस पल्स को एक ऐसी घटना भेजनी चाहिए जिसे आपको दो स्थानों पर संभालना पड़ सकता है। सबसे पहले, यदि आप वाहनों की स्थिति को अनिश्चित काल तक संग्रहीत करना चाहते हैं, तो आपको उन्हें सर्वर-साइड एकत्र करना होगा और उन्हें अपने डेटाबेस में धकेलना होगा। हालाँकि, यदि आप चाहते हैं कि कोई वाहन यात्रा करते समय एक रेखा खींचे, तो आप उस कार्यक्षमता को क्लाइंट में रख सकते हैं।

Comments

उत्तर के लिए धन्यवाद, लेकिन, मैं अपने डेटाबेस में डेटा स्टोर होगा ieMySQL। मैं लाइव ट्रैकिंग नहीं चाहता, लेकिन जहां मेरा वाहन चला गया है, वहां का इतिहास, इसके लिए मैं ट्रैक का एनीमेशन इस उदाहरण में दिखाना चाहता था ( econym.org.uk/gmap/example_cartrip2.htm )। मैं संग्रहीत डेटा में एनीमेशन जोड़ना चाहता था। जहां कार की छवि (यानी पीएनजी) चलेगी और वाहन ट्रैक पहले लिंक के रूप में इस छवि को स्थानांतरित करेगा।

— परी