2016-11-07 84 views
0

我嘗試使用微軟的地圖API在我的應用程序,但是當我打電話L.tileLayer.extend我有一個像傳單:不能與打字稿2.0和角2

my code

一些錯誤有擴展TileLayer我代碼:

import { Component, OnInit } from '@angular/core'; 
import '../../public/css/styles.css'; 
import * as L from 'leaflet'; 
@Component({ 
    selector: 'my-app', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.css'] 
}) 
export class AppComponent implements OnInit { 

    public map: any; 
    public poiLayer: any; 

public _quadKey(x:any, y:any, z:any):string { 
      var quadKey:any = []; 
      for (var i = z; i > 0; i--) { 
       var digit:any = '0'; 
       var mask = 1 << (i - 1); 
       if ((x & mask) != 0) { 
        digit++; 
       } 
       if ((y & mask) != 0) { 
        digit++; 
        digit++; 
       } 
       quadKey.push(digit); 
      } 
      return quadKey.join(''); 
     } 
    ngOnInit() { 
    this.map = L.map(name, { 
      center: L.latLng(46.72139, 2.51028), /*St Amand Montrond */ 
      zoom: 5, 
      maxZoom: 18, 
      zoomControl: false 
     }); 

     var BingLayer = L.tileLayer.extend({ 
      getTileUrl: function (tilePoint:any) { 
       return L.Util.template(this._url, { 
        s: this._getSubdomain(tilePoint), 
        id: this.options.id, 
        q: this._quadKey(tilePoint.x, tilePoint.y, this._getZoomForUrl()) 
       }); 
      }, 
      _quadKey: function (x:any, y:any, z:any) { 
       let quadKey:any = []; 
       for (var i = z; i > 0; i--) { 
        let digit = 0; 
        let mask = 1 << (i - 1); 
        if ((x & mask) != 0) { 
         digit++; 
        } 
        if ((y & mask) != 0) { 
         digit++; 
         digit++; 
        } 
        quadKey.push(digit); 
       } 
       return quadKey.join(''); 
      } 
     }); 
     //http:\/\/ecn.t{s}.tiles.virtualearth.net\/tiles\/{id}{q}.jpeg?g=414&mkt=fr 
     //http://t{s}.tiles.virtualearth.net/tiles/{id}{q}.jpeg?g=1398&dpi=d1&device=mobile 
     let bing = 'http://t{s}.tiles.virtualearth.net/tiles/{id}{q}.jpeg?g=1398&dpi=d1&device=mobile'; 
     let dmic = '<a href="http://www.dmic.fr"><img height="50px" src="../../../res/img/logo_dmic_small.png" /></a>'; 
     this.poiLayer = L.layerGroup(); 
     this.poiLayer.addTo(this.map); 
     let layers = { 
      'Routière': new BingLayer(bing, { attribution: dmic, id: 'r', subdomains: ['0', '1', '2', '3', '4'], detectRetina: true }), 
      'Satellite': new BingLayer(bing, { attribution: dmic, id: 'a', subdomains: ['0', '1', '2', '3', '4'], detectRetina: true }) 
     }; 

     let overlays = { 
      'Traffic': L.tileLayer('http://trafficservices2.v-trafic.com/mapServer/?mode=tile&tilemode=gmap&mr=cr_trafic_wms.map&layers=fra_rc&tile={x}+{y}+{z}'), 
      'Repères': this.poiLayer 
     }; 
     this.map.attributionControl.options.prefix = false; 
     layers[Object.keys(layers)[0]].addTo(this.map); 
     L.control.layers(layers, overlays).addTo(this.map); 
    } 
} 

這個腳本運行良好角2 + 1樓打字稿

有人有一個想法,爲什麼我不能打字稿2致以tileLayer 0.0?

+2

經過多次測試我切換index.d.ts鏈接到單張提供打字稿2與index.d.ts由類型提供,它的工作很好,所以npm安裝--save-dev @ types/leaflet不給我們的良好聲明文件。 –

+1

您可能希望將您的評論添加爲[自我回復](http://stackoverflow.com/help/self-answer),因爲其他人可能會發現此信息有用。 – cartant

回答

0

經過更多的測試,我將index.d.ts鏈接切換到typecript 2提供的index.html提供的type.d.ts類型,並且工作正常,所以npm install --save-dev @ types/leaflet don給我們好的申報文件。

+1

我不太清楚如何去做你做的事。你能詳細說明一下嗎? – Methodician