Wednesday, 30 December 2015

openlayers - Add feature manually to a vector layer in ol3


I'm trying to add a layer manually to a vector layer with javascript. I can't seem to determine why this is failing:


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


I've tried sane coordinates like 16,22, and big ones to match the view's xy values. I get a javascript error from ol3 : TypeError: b.Q is not a function.


HTML:




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 );


Answer



As Gabor Farkas said, I was adding the geometry and not a feature to the source. I was also missing [] on the coordinates to the geometry, and wasn't converting properly. Outside of here, I was using lat/long as x/y instead of y/x. Updated fiddle:


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


HTML:




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 );

No comments:

Post a Comment

arcpy - Changing output name when exporting data driven pages to JPG?

Is there a way to save the output JPG, changing the output file name to the page name, instead of page number? I mean changing the script fo...