科尔多瓦包装角单张不加载因协议不匹配的瓷砖 [英] Angular Leaflet in Cordova wrapper doesn't load tiles due to protocol mismatch

问题描述

我刚刚开始使用角单张指令（的http：// tombatossals .github.io /角单张-指令/＃！/ ）和我试图离子项目中整合这种

I've just started using the Angular Leaflet directive (http://tombatossals.github.io/angular-leaflet-directive/#!/) and I'm trying to integrate this within an Ionic project.

在浏览器中，一切工作正常：该地图图块在加载时我编译X code中的应用和iOS的模拟器中运行，如预期地砖不加载

On the browser, everything works fine: the map tiles are loaded in. When I compile the app with XCode and run in within the iOS simulator, the tiles do not load as expected.

当我用的是检查，我注意到，对于在装载瓷砖的HTML如下形式：

When I use the inspector, I noticed that the html for the tiles that are loaded in is of the following form:

＆LT; IMG类=单张瓦单张瓦加载SRC =// b.tile.openstreetmap.org/18/131008/87171.png的风格=高度： 256PX;宽度：256PX;左：791px;顶部：-114px;＆GT;

注意该协议与src属性缺失。在科尔多瓦封装，应用程序假定这应该是文件：//，自然无法在瓦加载

Notice the protocol is missing with the src property. Within the Cordova wrapper, the app assumes that this should be file://, and naturally fails to load in the tiles.

有什么办法要么：

1. 显式的HTTP地址：//协议的IMG SRC


2. 设置科尔多瓦为默认为http：//与URI的以//
启动

GitHub上的问题： https://github.com/tombatossals/angular-leaflet -directive /问题/ 460

GitHub issue: https://github.com/tombatossals/angular-leaflet-directive/issues/460

推荐答案

此问题似乎被固定在角单张指令的最新版本。

This issue seems to be fixed in the current version of the Angular Leaflet Directive.

我目前用在我的控制器此code和在浏览器的工作原理，以及对设备：

I am currently using this code in my controller and it works in the browser as well as on device:

  angular.extend($scope, {
    center: {
      lat: 52.367215,
      lng: 4.893036,
      zoom: 1
    },
    maxbounds: {},
    defaults: {
      maxZoom: 16,
      minZoom: 12,
      tileLayer: "http://{s}.tile.opencyclemap.org/cycle/{z}/{x}/{y}.png",
      tileLayerOptions: {
          opacity: 0.9,
          detectRetina: true,
          reuseTiles: true,
      },
      scrollWheelZoom: true
    }
  })

这篇关于科尔多瓦包装角单张不加载因协议不匹配的瓷砖的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！