Thêm tính năng thủ công vào lớp vectơ trong ol3


16

Tôi đang cố gắng thêm một lớp thủ công vào một lớp vectơ bằng javascript. Tôi dường như không thể xác định lý do tại sao điều này là thất bại:

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

Tôi đã thử các tọa độ lành mạnh như 16,22 và các tọa độ lớn để khớp với các giá trị xy của chế độ xem. Tôi gặp lỗi javascript từ ol3: TypeError: bQ không phải là một chức năng.

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

Với ol3-debug.js, tôi nhận được "AssertsError: Failure: không được hỗ trợ: không xác định"
Kieveli

2
Bạn đang cố gắng thêm một hình học vào nguồn. Gói nó trong một ol.Featuređầu tiên.
Gabor Farkas

1
Đẹp! Tôi cũng đã thiếu chuyển đổi từ lat / long sang y / x. Cập nhật fiddle: jsfiddle.net/Kieveli/f4t6n6v1/7
Kieveli

Câu trả lời:


22

Như Gabor Farkas đã nói, tôi đã thêm hình học và không phải là một tính năng cho nguồn. Tôi cũng bị thiếu [] trên tọa độ hình học và không chuyển đổi đúng. Ngoài đây, tôi đã sử dụng lat / long là x / y thay vì y / x. Cập nhật fiddle:

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 );
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.