首页 / 浏览问题 / 桌面GIS / 问题详情
OpenLayers 绘制完成后线条消失
9EXP 2023年03月02日
var url = "http://192.168.0.65:8099/iserver/services/map-world/rest/maps/World";
var layer = new TileLayer({
  source: new TileSuperMapRest({
    url: url,
  }),
  projection: 'EPSG:4326'
})

var map = new Map({
  target: 'map',
  controls: ol.control.defaults({attributionOptions: {collapsed: false}}),
  view: new View({
    center: [-2.3294202469697893, 2.6155432633804367],
    projection: 'EPSG:4326',
    zoom: 3,
    multiWorld: true,
  }),
});

var source = new sourceVector({
  wrapX: false,
});
var vectorLayer = new layerVector({
  source: source,
  style: new Style({
    stroke: new Stroke({
      color: 'rgb(255,0,0)',
      width: 2
    }),
    fill: new Fill({
      color: 'rgba(179,172,172,0.2)',
    }),
  })
});
map.addLayer(vectorLayer);
map.addControl(layer)



var drawPoint = new ol.interaction.Draw({
  source: source,
  type: "LineString"
});
var featurePoint;
var output = 0;
drawPoint.on('drawstart', function(evt) {
  featurePoint = evt.feature;
});

drawPoint.on('drawend', function(evt) {
  // 设置量算服务参数
  var distanceMeasureParam = new MeasureParameters(featurePoint.getGeometry());
  new ol.supermap.MeasureService(url,
    {measureMode: ""}).measureDistance(distanceMeasureParam, function (serviceResult) {
    alert(serviceResult.result.distance);
  });
  featurePoint.plotType = 'plotPoint';
  featurePoint.setStyle(new Style({
    text: new Text({
      tAlign: 'center',
      placement: 'line',
      textBaseline: 'top',
      offsetY: 5,
      font: "12px 'Microsoft Yahei'",
      text: output + "m",
      fill: new Fill({
        color: '#ff0000',
        width: 2
      }),
    })
  }));
});
map.addInteraction(drawPoint);

2 个回答

我已找到问题所在,也要注意地图的layer必须是第一个添加的

map.addLayer(vectorLayer);
map.addControl(layer)

替换为

map.addLayer(vectorLayer);

map.addLayer(layer)

9EXP 2023年03月02日
首先:尝试把和interaction不相关的layer注释掉,

第二,把不相关的interaction也注释掉,或者disable了

我也开发web端 iclient for openlayers 的时候遇到过类似的,我的是interaction冲突了
9EXP 2023年03月02日

我这好像没有多余的,如果改成这样是可以看到;但是颜色不对就感觉是想在上面加了一层蒙版。

var layer = new TileLayer({
  opacity: 0.7,
  source: new TileSuperMapRest({
    url: url,
  }),
  projection: 'EPSG:4326'
})

我在这里试了,发现也不行,我就是先添加底图layer的。SuperMap REST 地图服务底图

...