Aggiungi funzionalità manualmente a un livello vettoriale in ol3


16

Sto cercando di aggiungere manualmente un livello a un livello vettoriale con javascript. Non riesco a determinare perché questo non stia funzionando:

http://jsfiddle.net/Kieveli/f4t6n6v1/4/

Ho provato coordinate sane come 16,22 e grandi coordinate per abbinare i valori xy della vista. Ottengo un errore javascript da ol3: TypeError: bQ non è una funzione.

HTML:

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

Javascript:

var vectorSource = new ol.source.Vector({});

var map = new ol.Map({
  layers: [
      new ol.layer.Tile({
          source: new ol.source.MapQuest({layer: 'sat'})
      }),
      new ol.layer.Vector({
          source: vectorSource
      })
  ],
  target: 'map',
  view: new ol.View({
    center: [-11000000, 4600000],
    zoom: 4
  })
});

var thing = new ol.geom.Polygon( [ [16000000,22000000],[44000000,55000000],[88000000,90000000] ] );
vectorSource.addFeature( thing );

Con ol3-debug.js, ottengo "AssertionError: Failure: non supportato passo: undefined"
Kieveli

2
Stai provando ad aggiungere una geometria alla sorgente. Avvolgilo in un ol.Featureprimo.
Gabor Farkas,

1
Bello! Mi mancava anche la conversione da lat / long a y / x. Aggiornamento del violino: jsfiddle.net/Kieveli/f4t6n6v1/7
Kieveli

Risposte:


22

Come diceva Gabor Farkas , stavo aggiungendo la geometria e non una caratteristica alla fonte. Mi mancava anche [] sulle coordinate della geometria e non mi stavo convertendo correttamente. Fuori da qui, stavo usando lat / long come x / y anziché y / x. Fiddle aggiornato:

http://jsfiddle.net/Kieveli/f4t6n6v1/7/

HTML:

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

Javascript:

var vectorSource = new ol.source.Vector({});

var map = new ol.Map({
  layers: [
      new ol.layer.Tile({
          source: new ol.source.MapQuest({layer: 'sat'})
      }),
      new ol.layer.Vector({
          source: vectorSource
      })
  ],
  target: 'map',
  view: new ol.View({
    center: [-11000000, 4600000],
    zoom: 4
  })
});

var thing = new ol.geom.Polygon( [[
    ol.proj.transform([-16,-22], 'EPSG:4326', 'EPSG:3857'),
    ol.proj.transform([-44,-55], 'EPSG:4326', 'EPSG:3857'),
    ol.proj.transform([-88,75], 'EPSG:4326', 'EPSG:3857')
]]);
var featurething = new ol.Feature({
    name: "Thing",
    geometry: thing
});
vectorSource.addFeature( featurething );
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.