जब मैं Google मानचित्र v3 में किसी विशेष क्षेत्र पर माउसओवर करता हूं तो मैं माउस कर्सर कैसे बदलूं?

Google मानचित्र API v3 का उपयोग करना: जब मैं किसी विशेष क्षेत्र पर माउसओवर करता हूं तो मैं माउस कर्सर कैसे बदलूं?जब मैं Google मानचित्र v3 में किसी विशेष क्षेत्र पर माउसओवर करता हूं तो मैं माउस कर्सर कैसे बदलूं?

स्रोत

2010-04-01 zjm1126

हाँ, यह MapOptions में draggableCursor की स्थापना, निम्न उदाहरण में से संभव है:

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
    <title>Google Maps v3 Change Cursor Demo</title> 
    <script src="http://maps.google.com/maps/api/js?sensor=false" 
      type="text/javascript"></script> 
</head> 
<body> 
    <div id="map" style="width: 500px; height: 350px"></div> 

    <script type="text/javascript"> 
     var map = new google.maps.Map(document.getElementById("map"), { 
             mapTypeId: google.maps.MapTypeId.ROADMAP, 
             zoom: 8, 
             center: new google.maps.LatLng(-34.3, 150.6) 
            }); 

     var ne = new google.maps.LatLng(-34.00, 150.00); 
     var nw = new google.maps.LatLng(-34.00, 150.50);        
     var sw = new google.maps.LatLng(-35.00, 150.50); 
     var se = new google.maps.LatLng(-35.00, 150.00); 

     var boundingBox = new google.maps.Polyline({ 
     path: [ne, nw, sw, se, ne], 
     strokeColor: '#FF0000' 
     }); 

     boundingBox.setMap(map); 

     google.maps.event.addListener(map, 'mousemove', function(event) { 
     if ((event.latLng.lat() > se.lat()) && (event.latLng.lat() < ne.lat()) && 
      (event.latLng.lng() > ne.lng()) && (event.latLng.lng() < sw.lng())) { 
      map.setOptions({ draggableCursor: 'crosshair' }); 
     } 
     else { 
      map.setOptions({ draggableCursor: 'url(http://maps.google.com/mapfiles/openhand.cur), move' }); 
     } 
     }); 
    </script> 
</body> 
</html>

आप ऊपर के उदाहरण चलाते हैं, कर्सर एक क्रॉस बालों के लिए बदल जाएगा एक बार माउस के अंदर ले जाया जाता है लाल आयताकार

Google Maps Change Cursor http://img535.imageshack.us/img535/5923/mapcursor.png

स्रोत

2010-04-01 03:31:38

उदाहरण किसी कारण से काम नहीं करता है जैसे श्रोता जोड़ सकते हैं, लेकिन कोड वास्तव में जब काम करता है मैं इसे अपने कोड में आज़माता हूं! – Michel

उदाहरण सिर्फ एक छवि है :) – Alp

यदि मैं पॉलीलाइन के बजाय पॉलीगॉन का उपयोग करता हूं तो मैं क्या कर सकता हूं? draggableCursor ने काम नहीं किया है .. कर्सर अभी भी सूचक है –

अन्य को सलाह दे जवाब पूरे नक्शा वस्तु पर 'MouseMove' श्रोताओं डाल कार्य करेगी, लेकिन गलत हैं करने के लिए। यह 'भारी हाथ' और एक बुरा विचार है क्योंकि इस तरह के श्रोताओं को एक वास्तविक आवेदन में जोड़ दिया जा सकता है और जब आपके मानचित्र पर होने वाली अन्य चीजों के साथ मिलकर, गंभीर प्रदर्शन समस्याओं और संभावित रूप से अप्रत्याशित दौड़ की स्थिति पैदा हो सकती है!

ऐसा करने का सबसे अच्छा तरीका google.maps.Polygon कक्षा का उपयोग करना है। यह आपको बहुभुज बनाने के लिए LatLng ऑब्जेक्ट्स की श्रृंखला को पारित करने की अनुमति देता है। यह बहुभुज मानचित्र पर प्रस्तुत किया गया है और इसमें 'पॉइंटर' का एक डिफ़ॉल्ट माउसओवर विशेषता है, आप new google.maps.Polygon क्लास कॉल से लौटाई गई ऑब्जेक्ट में 'माउसओवर' श्रोता जोड़ सकते हैं।

नीचे स्रोत इस उदाहरण से है http://code.google.com/apis/maps/documentation/javascript/examples/polygon-simple.html

var myLatLng = new google.maps.LatLng(24.886436490787712, -70.2685546875); 
var myOptions = { 
    zoom: 5, 
    center: myLatLng, 
    mapTypeId: google.maps.MapTypeId.TERRAIN 
}; 

var bermudaTriangle; 

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

var triangleCoords = [ 
    new google.maps.LatLng(25.774252, -80.190262), 
    new google.maps.LatLng(18.466465, -66.118292), 
    new google.maps.LatLng(32.321384, -64.75737) 
]; 

bermudaTriangle = new google.maps.Polygon({ 
    paths: triangleCoords, 
    strokeColor: "#FF0000", 
    strokeOpacity: 0.8, 
    strokeWeight: 3, 
    fillColor: "#FF0000", 
    fillOpacity: 0.35 
}); 

bermudaTriangle.setMap(map);

तब मैं इस

google.maps.event.addListener(bermudaTriangle, 'mouseover', function() { 
    map.setZoom(8); 
}); 
//now if you mouse over the Polygon area, your map will zoom to 8

स्रोत

2012-01-19 06:57:32 nomis

जब मैं Google मानचित्र v3 में किसी विशेष क्षेत्र पर माउसओवर करता हूं तो मैं माउस कर्सर कैसे बदलूं?

उत्तर

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