2013-02-08 12 views
5

जैसा कि मैं readme फ़ाइल से लाल, openlayers.js में फ़ाइलों और विषयों को शामिल करने के लिए कई विकल्प हैं।OpenLayers.js कौन सी फाइलों का उपयोग करने के लिए?

मुझे क्या चाहिए lightest solution of openlayers.js फ़ाइलों का उपयोग करना है।

मैं अपने अनुप्रयोग में openlayers.light.js शामिल है, और यह नक्शे बनाता है, लेकिन उन्हें नहीं दिखा, इस जाँच:

enter image description here

मैं कुछ अन्य फ़ाइल शामिल करना भूल जाते हैं?

/vendor 
    /js 
    openlayers.light.js 
    /img 
    /theme 

कैसे दिखाने के लिए नक्शे परतों:

मेरी संरचना संरचना है?

भी openlayers.light.js मोबाइल उपकरणों पर काम करेगा (एक बार यह समस्या ठीक हो गई है: पी)? या मुझे openlayers.mobile.js भी शामिल करने की आवश्यकता होगी?

var _element = "#map"; 
var map = new OpenLayers.Map (_element, { 
    controls: [ 
    new OpenLayers.Control.Navigation({ 
     dragPanOptions: { 
     enableKinetic: true 
     } 
    }), 
    new OpenLayers.Control.Zoom() 
    ], 
    projection: new OpenLayers.Projection("EPSG:900913"), 
    displayProjection: new OpenLayers.Projection("EPSG:4326") 
    }); 

    var lonLat = new OpenLayers.LonLat(_lon, _lat).transform (
new OpenLayers.Projection("EPSG:4326"), // transform from WGS 1984 
new OpenLayers.Projection("EPSG:900913") // to Spherical Mercator Projection 
// map.getProjectionObject() doesn't work for unknown reason 
); 
    var markers = new OpenLayers.Layer.Markers("Markers"); 
    map.addLayer(markers); 

    var size = new OpenLayers.Size(21,25); 
    var offset = new OpenLayers.Pixel(-(size.w/2), -size.h); 
    var icon = new OpenLayers.Icon(_img_map_marker, size, offset); 
    markers.addMarker(new OpenLayers.Marker(lonLat, icon.clone())); 

    var mapnik = new OpenLayers.Layer.OSM("Test"); 
    map.addLayer(mapnik); 

    map.setCenter (lonLat,3); 

पुनश्च:: मेरे openlayers नक्शा js init विधि ठीक है, यह बहुत बड़ा काम करता है का उपयोग कर

इस कोड openlayers.light.js के साथ काम लेकिन openlayers.js साथ काम नहीं कर रहा (740kb) है openlayers.js (740KB), लेकिन नहीं openlayers.light.js के साथ काम कर के रूप में मैं

एचटीएमएल

<div id="map"></div> 

सीएसएस ऊपर से पता चला

img{max-width:none;} 
#map{ 
width:300px; 
height:300px; 
} 

उत्तर

3

आप पैन या हाथ आप openlayers.mobile.js का उपयोग करने के साथ जूम करने के रूप में openlayers साथ मोबाइल गुणों का उपयोग करना चाहते हैं।

आप मोबाइल उपकरणों के साथ openlayers.light.js का उपयोग कर सकते हैं लेकिन मोबाइल फ़ंक्शंस नहीं।

मुझे लगता है कि आपके संरचना होना चाहिए:

myProject 
    /js 
     openlayers.light.js 
    /img 
    /theme 

और मैं http://jsfiddle.net/aragon/ZecJj/ में openlayers.light.js की कोशिश की है और वहाँ इसके साथ कोई समस्या नहीं है।

मेरे कोड:

var map = new OpenLayers.Map({ 
    div: "map", 
    minResolution: "auto", 
    maxResolution: "auto", 
}); 

var osm = new OpenLayers.Layer.OSM(); 
var toMercator = OpenLayers.Projection.transforms['EPSG:4326']['EPSG:3857']; 
var center = toMercator({x:-0.05,y:51.5}); 
map.addLayers([osm]); 


map.setCenter(new OpenLayers.LonLat(center.x,center.y), 13); 

और Deploying (Shipping OpenLayers in your Application) पढ़ने के लिए प्रयास करें।

OpenLayers बॉक्स से बाहर पहले से कॉन्फ़िगर उदाहरण के साथ आता है: बस OpenLayers की रिहाई डाउनलोड, और आप उपयोग उदाहरण के लिए आसान का एक पूरा सेट मिलता है। हालांकि, इन उदाहरणों को विकास के लिए उपयोग करने के लिए डिज़ाइन किया गया है। जब आप अपने आवेदन को तैनात करने के लिए तैयार हों, तो आप बैंडविड्थ और लोडिंग समय को सीमित करने के लिए अत्यधिक अनुकूलित ओपनलेयर वितरण चाहते हैं।

आप इस लिंक के साथ src फ़ाइल बदल सकते हैं और देख सकते हैं कि यह अभी भी काम करता है।

<script type="text/javascript" src="http://openlayers.org/dev/OpenLayers.light.debug.js"></script> 

<script type="text/javascript" src="https://view.softwareborsen.dk/Softwareborsen/Vis%20Stedet/trunk/lib/OpenLayers/2.12/OpenLayers.light.js?content-type=text%2Fplain"></script> 

मैं आशा है कि यह आप में मदद करता है के लिए

...

+0

मेरे सवाल जाँच कृपया मैं अपने कोड के साथ अद्यतन, मैं भी js फ़ाइलों संरचना को बदल नहीं सकते हैं, इसके लिए एक मानक है मुझे मुख्य रूट पर नहीं सभी अंदर/विक्रेता – sbaaaang

+0

ने आपके ओपनलेयर स्रोत के साथ भी प्रयास किया है, यह अभी भी काम नहीं कर रहा है – sbaaaang

+0

मैंने अपने कोड के साथ [my fiddle] (http://jsfiddle.net/aragon/ZecJj/) अपडेट किया है केवल एक समस्या है 'dragPanOptions'। मुझे लगता है कि OpenLayers.light.js विशेष कार्यों के लिए इतना विस्तृत नहीं है। – Aragon

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

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