以像素为单位的 OpenLayers 特征

Question

我有一个问题，我不知道如何解决。

var deletedFeatures = [];
var nuevaRegionId = -1;
var featureID = -1;
var extent = [0, 0, 650, 366];
var projection = new ol.proj.Projection({
  code: 'xkcd-image',
  units: 'pixels',
  extent: extent
});

var map = new ol.Map({
  layers: [
    new ol.layer.Image({
      source: new ol.source.ImageStatic({
        attributions: [
          new ol.Attribution({
            html: '<a href="http://www.somepage.com/">More</a>'
          })
        ],
        url: "<?php echo $img ?>",
        projection: projection,
        imageExtent: extent
      })
    })
  ],
  target: 'map',
  view: new ol.View({
    projection: projection,
    center: ol.extent.getCenter(extent),
    zoom: 2,
    minZoom: 1,
    maxZoom: 4
  })
});

问题是我从 700px x 500px 的图像中保存了特征

当我添加此功能时，它并未绘制在图像的相应像素处。

[[[432.275390625,268.188476562],[407.51953125,56.8115234375],[469.091796875,53.0029296875],[484.9609375,262.475585938],[432.275390625,268.188476562]]]

如果我手动绘制有不同的值。

有没有办法以像素而不是 openlayers 度量来绘制特征？

要保存特征：

var features = featureOverlay.getSource().getFeatures();
var format = new ol.format["GeoJSON"]();
data = format.writeFeatures(features);

我用 var extent = [0, 0, 650, 366] 解决了我的问题；这必须与图像的宽度和高度相同，另一个问题是 te 轴，对我来说是 X，Y 从左下到上，对他们来说是从左上到下

Answer 1

var 范围 = [0, 0, 650, 366]; --> 这需要与图像相同，获取高度和宽度并在那里输入。

那么在我的例子中，我从左上角 (0,0) 接收到的 x,y 坐标在 OpenLayers 中 (0,0) 是左下角

例如：如果图片是 500x500，我收到的矩形坐标是：[0,0][0,100],[100,100],[100,0] 对我来说，OpenLayers 中的正确坐标是：[[0,0],[0,400],[0,400],[100,400],[0,0]] 对我来说 Y = 500-y = 400.

以像素为单位的 OpenLayers 特征

OpenLayers features in pixels

javascript

image

openlayers-3

pixels