OpenLayers.js要使用哪些文件?

its*_*sme 5 javascript maps file openlayers include-path

当我从readme文件中红色时,openlayers.js有多种选择来包含文件和主题.

我想要的是使用lightest solution of openlayers.js文件.

openlayers.light.js在我的应用程序中包含了它,它创建了地图但没有显示它们,请检查:

在此输入图像描述

我忘了包含其他一些文件吗?

我的结构结构如下:

/vendor
   /js
     openlayers.light.js
     /img
     /theme
Run Code Online (Sandbox Code Playgroud)

如何显示地图图层?

openlayers.light.js也适用于移动设备(一旦解决了这个问题:P)?或者我也需要包括在内openlayers.mobile.js

这是不使用openlayers.light.js但使用openlayers.js(740kb)的代码:

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);
Run Code Online (Sandbox Code Playgroud)

PS:我的openlayers地图js init方法还可以,它可以使用巨大的openlayers.js (740KB),但不能使用openlayers.light.js,如上所示

HTML

<div id="map"></div>
Run Code Online (Sandbox Code Playgroud)

CSS

img{max-width:none;}
#map{
width:300px;
height:300px;
}
Run Code Online (Sandbox Code Playgroud)

Ara*_*gon 3

如果你想使用 openlayers 的移动属性作为手动平移或缩放,你必须使用 openlayers.mobile.js。

\n\n

您可以在移动设备上使用 openlayers.light.js,但不能在移动功能上使用。

\n\n

我认为你的结构应该是:

\n\n
myProject\n   /js\n      openlayers.light.js\n   /img\n   /theme\n
Run Code Online (Sandbox Code Playgroud)\n\n

我在http://jsfiddle.net/aragon/ZecJj/中尝试了 openlayers.light.js中尝试了 openlayers.light.js ,没有问题。

\n\n

我的代码:

\n\n
var map = new OpenLayers.Map({\n    div: "map",\n    minResolution: "auto",\n    maxResolution: "auto",\n});\n\nvar osm = new OpenLayers.Layer.OSM();\nvar toMercator = OpenLayers.Projection.transforms[\'EPSG:4326\'][\'EPSG:3857\'];\nvar center = toMercator({x:-0.05,y:51.5});\nmap.addLayers([osm]);\n\n\nmap.setCenter(new OpenLayers.LonLat(center.x,center.y), 13);\n
Run Code Online (Sandbox Code Playgroud)\n\n

并尝试阅读部署(在应用程序中运送 OpenLayers)

\n\n
\n

OpenLayers 附带开箱即用的预配置示例:只需下载 OpenLayers 版本,您就可以获得一整套易于使用的示例。但是,这些示例旨在用于\n 开发。当您准备好部署应用程序时,您需要高度优化的 OpenLayers 发行版,以限制带宽和加载时间。

\n
\n\n

您可以使用此链接更改 src 文件,并且可以看到它仍然有效。

\n\n
 <script type="text/javascript" src="http://openlayers.org/dev/OpenLayers.light.debug.js"></script>\n
Run Code Online (Sandbox Code Playgroud)\n\n

\n\n
<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>\n
Run Code Online (Sandbox Code Playgroud)\n\n

我希望它能帮助你...

\n