Google मानचित्र v3

में रूट का रंग बदलने के लिए कैसे मैं दो अंक के बीच दिशानिर्देश प्राप्त करने के लिए इस code का उपयोग कर रहा हूं। क्या नीले रंग से मार्ग का रंग बदलना संभव है? मैं अपने कोड में पॉलीलाइन का उपयोग नहीं कर रहा हूं। अग्रिम में :)Google मानचित्र v3

स्रोत

2013-09-26 user2809895

Thanx जब आप DirectionsRenderer बनाते हैं तो आप रेखा का रंग निर्दिष्ट कर सकते हैं, वैकल्पिक DirectionsRendererOptions struct का उपयोग कर।

यह मेरे लिए काम करता है, बस लाइन जहां DirectionsRendered वस्तु बनाई गई है बदल रहा है:

<!DOCTYPE html> 
<html> 
    <head> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> 
    <meta charset="utf-8"> 
    <title>Directions service</title> 
    <link href="https://google-developers.appspot.com/maps/documentation/javascript/examples/default.css" rel="stylesheet"> 
    <script src="https://maps.googleapis.com/maps/api/js?v=3"></script> 
    <script> 
var directionsDisplay; 
var directionsService = new google.maps.DirectionsService(); 
var map; 

function initialize() { 
    directionsDisplay = new google.maps.DirectionsRenderer({ 
    polylineOptions: { 
     strokeColor: "red" 
    } 
    }); 

    var mapOptions = { 
    zoom:7, 
    mapTypeId: google.maps.MapTypeId.ROADMAP, 
    center: {lat: 41.850033, lng: -87.6500523} 
    } 
    map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 
    directionsDisplay.setMap(map); 
} 

function calcRoute() { 
    var start = document.getElementById('start').value; 
    var end = document.getElementById('end').value; 
    var request = { 
     origin:start, 
     destination:end, 
     travelMode: google.maps.DirectionsTravelMode.DRIVING 
    }; 
    directionsService.route(request, function(response, status) { 
    if (status == google.maps.DirectionsStatus.OK) { 
     directionsDisplay.setDirections(response); 
    } 
    }); 
} 

google.maps.event.addDomListener(window, 'load', initialize); 
    </script> 
    </head> 
    <body> 
    <div id="panel"> 
    <b>Start: </b> 
    <select id="start" onchange="calcRoute();"> 
     <option value="chicago, il">Chicago</option> 
     <option value="st louis, mo">St Louis</option> 
     <option value="joplin, mo">Joplin, MO</option> 
     <option value="oklahoma city, ok">Oklahoma City</option> 
     <option value="amarillo, tx">Amarillo</option> 
     <option value="gallup, nm">Gallup, NM</option> 
     <option value="flagstaff, az">Flagstaff, AZ</option> 
     <option value="winona, az">Winona</option> 
     <option value="kingman, az">Kingman</option> 
     <option value="barstow, ca">Barstow</option> 
     <option value="san bernardino, ca">San Bernardino</option> 
     <option value="los angeles, ca">Los Angeles</option> 
    </select> 
    <b>End: </b> 
    <select id="end" onchange="calcRoute();"> 
     <option value="chicago, il">Chicago</option> 
     <option value="st louis, mo">St Louis</option> 
     <option value="joplin, mo">Joplin, MO</option> 
     <option value="oklahoma city, ok">Oklahoma City</option> 
     <option value="amarillo, tx">Amarillo</option> 
     <option value="gallup, nm">Gallup, NM</option> 
     <option value="flagstaff, az">Flagstaff, AZ</option> 
     <option value="winona, az">Winona</option> 
     <option value="kingman, az">Kingman</option> 
     <option value="barstow, ca">Barstow</option> 
     <option value="san bernardino, ca">San Bernardino</option> 
     <option value="los angeles, ca">Los Angeles</option> 
    </select> 
    </div> 
    <div id="map-canvas"></div> 
    </body> 
</html>

स्रोत

2013-09-26 08:52:32 duncan

मैं के रूप में सरल पॉलीलाइन ऑप्शन के बाद कोलन अप्रत्याशित है कि एक त्रुटि मिली है। क्या आप एक बार फिर कोड जांच सकते हैं और मुझे कुछ सुझाव दे सकते हैं? – user2809895

मेरे लिए काम करता है; मैं अपने उत्तर को पूर्ण कोड के साथ अपडेट कर दूंगा। यदि आप एक वाक्यविन्यास त्रुटि है तो हम आपके कोड को अपने प्रश्न में जोड़ना चाहेंगे। कोड के लिए – duncan

thnq बहुत कुछ। यह काम कर रहा है। – user2809895

आप स्ट्रोक रंग बदलकर रंग बदल सकते हैं :) कि

directionsService = new google.maps.DirectionsService(); 
    directionsDisplay = new google.maps.DirectionsRenderer({ polylineOptions: { strokeColor: "#8b0013" } }); 
    directionsDisplay.setMap(map); 
    directionsDisplay.setOptions({ suppressMarkers: true }); 


     calcRoute();

स्रोत

2014-08-31 04:19:02

" स्थिर नक्शा उत्पन्न करते समय polylines (सरणी) "और" polylineOptions "? जैसे: "https: //maps-api-ssl.google.com/maps/api/staticmap? ...." –

Google मानचित्र v3

उत्तर

संबंधित मुद्दे