标签: openlayers

Openlayers：GeoJSON 和坐标

我正在尝试解析 GeoJSON 数据并在 ESPG:4326 地图上绘制“点”，并取得了一些成功。它在地图上绘制“点”，但使用默认设置 [0, 0]。我是 Openlayers 的新手。我还让我的 geojson 通过了两个验证器，结果没有错误。我下面的代码是一个 .js 文件。

我之前在更改地图的“中心”时遇到过类似的问题，我使用“fromLonLat”来解决该问题。我假设有某种涉及“fromLonLat”的解决方案，但我在 Openlayers 6 上的任何地方都找不到与此相关的任何内容。

import Feature from 'ol/Feature';
import Map from 'ol/Map';
import View from 'ol/View';
import GeoJSON from 'ol/format/GeoJSON';
import Point from 'ol/geom/Point';
import {fromLonLat} from 'ol/proj';
import {defaults as defaultInteractions, DragRotateAndZoom} from 'ol/interactio$
import {Tile as TileLayer, Vector as VectorLayer} from 'ol/layer';
import {OSM, Vector as VectorSource} from 'ol/source';
import {Circle as CircleStyle, Fill, Stroke, Style} from 'ol/style';

var image = new CircleStyle({
  fill: new …

Run Code Online (Sandbox Code Playgroud)

javascript openlayers geojson

sne*_*all

2019 11-26

2
推荐指数

1
解决办法

1750
查看次数

Openlayers：LineString 上的渐变发光

我有一个渲染 LineStrings 的图层，并尝试对线条应用发光效果。我创建的样式使用自定义渲染器来创建具有垂直于每个线段的渐变的笔划：

const glow_style = new Style({
  renderer: (_coords, state) => {
    const ctx = state.context;
    const coords = _coords as Coordinate[];
    ctx.lineWidth = 25;
    for (let i = 1; i < coords.length; i++) {
      const start = coords[i - 1];
      const end = coords[i];
      const [grd_start, grd_end] = getPerpendicularPoints(start, end, ctx.lineWidth);
      const grd = ctx.createLinearGradient(grd_start[0], grd_start[1], grd_end[0], grd_end[1]);
      grd.addColorStop(0, '#ffffff00');
      grd.addColorStop(0.5, 'white');
      grd.addColorStop(1, '#ffffff00');
      ctx.strokeStyle = grd;
      ctx.beginPath();
      ctx.moveTo(start[0], start[1]);
      ctx.lineTo(end[0], end[1]);
      ctx.stroke();
    }
  }
});

Run Code Online (Sandbox Code Playgroud)

这种样式适用于完全直线，但在拐角处会失效，因为线段之间的渐变不能很好地连接。如果ctx.lineCap …

transparency openlayers typescript

Ace*_*Ace

lucky-day

2
推荐指数

1
解决办法

1214
查看次数

OpenLayers 按百分比增加或减少范围

我有一张地图，上面有一些功能，当我缩放到这些功能时，用户可以设置缩放缓冲区的首选项。

我不确定 OL 中是否有内置的方法来执行此操作...我查看了文档，但看不到任何内容...不确定我是否错过了它？

zoomToSelectedFeatures() {
view.extent = MapOverlay.getSource().getExtent();
map.getView().fit(view.extent, MapValues.map.getSize());
}

Run Code Online (Sandbox Code Playgroud)

想知道是否有一种方法可以插入一个数字（例如 20%），从而使变焦放大 20%？

openlayers angular-openlayers openlayers-5 openlayers-6

Fun*_*bby

lucky-day

2
推荐指数

1
解决办法

1957
查看次数

在调整窗口大小之前，我无法正确显示 openlayer 地图

我这样设置地图：

this.map = new Map({
  target: 'map',
  layers: [new TileLayer({source: new OSM()})
  ],
  view: new View({
    center: [0, 0],
    zoom: 16,
  })
});

Run Code Online (Sandbox Code Playgroud)

打开页面后我得到这个：

调整大小之前

所以我打开控制台来缩小页面并加载地图：

调整大小后

您知道如何修复它吗？

openlayers typescript ionic-framework angular

Dom*_*ngo

2020 03-20

2
推荐指数

1
解决办法

2954
查看次数

使用 openlayers 在给定坐标的地图上绘制点？

我正在尝试从包含约 300 个纬度和经度坐标的表中在 openlayers 地图上绘制约 300 个点。我找到的所有关于如何做到这一点的信息都是他们网站上的绘制功能，但它可以通过用户单击鼠标来绘制点，而不是自动绘制。有没有办法从代码中在地图上绘制一个点？谢谢。

javascript maps openlayers openstreetmap

mat*_*hik

lucky-day

2
推荐指数

1
解决办法

8080
查看次数

将Bing地图图块集成到Google Maps API中

我目前设法将OpenStreetMap集成到Google Maps API中,如本例所示.我想知道我是否也可以将Bing Maps 磁贴集成到Google Maps API中.可能吗？我找不到任何相关的东西.

注意:我确实知道mapstraction,但是现在,我想坚持使用Google Maps API.

提前致谢.

google-maps openlayers openstreetmap bing-maps

par*_*ars

lucky-day

1
推荐指数

1
解决办法

3636
查看次数

如何在GetFeatureInfo请求中限制字段或获取特定字段？

实际上我正在使用此代码用于弹出示例的GetFeatureInfo现在我想限制弹出窗口中的字段.

<html>
  <head>
    <title>GetFeatureInfo Popup</title>
    <script src="ol/OpenLayers.js"></script>
    <link rel="stylesheet" href="ol/theme/default/style.css" type="text/css" />
    <link rel="stylesheet" href="ol/examples/style.css" type="text/css" />
    <script>
    OpenLayers.ProxyHost = "/cgi-bin/proxy.cgi?url=";
    /*Same as identifier*/  
    var map, info;

    function load() {
        map = new OpenLayers.Map({
            div: "map",
            maxExtent: new OpenLayers.Bounds(143.834,-43.648,148.479,-39.573)
        });

        var political = new OpenLayers.Layer.WMS("State Boundaries",
            "http://localhost:8080/geoserver/wms", 
            {'layers': 'topp:tasmania_state_boundaries', transparent: true, format: 'image/gif'},
            {isBaseLayer: true}
        );

        var roads = new OpenLayers.Layer.WMS("Roads",
            "http://localhost:8080/geoserver/wms", 
            {'layers': 'topp:tasmania_roads', transparent: true, format: 'image/gif'},
            {isBaseLayer: false}
        );

        var cities = new OpenLayers.Layer.WMS("Cities",
            "http://localhost:8080/geoserver/wms", 
            {'layers': 'topp:tasmania_cities', transparent: …

Run Code Online (Sandbox Code Playgroud)

geoserver openlayers

Par*_*ari

lucky-day

1
推荐指数

1
解决办法

4472
查看次数

openlayer地图的限制是什么？

大家好,我正在为我的下一个项目做一些基础工作,我需要在应用程序中显示地图.我发现了谷歌地图的一个列表,我在这里找到了一个列表谷歌地图api的替代品我正在考虑使用OpenLayer 地图.我想知道OpenLayers是否有任何限制使用OpenLayers.我在OpenLayers网站上找不到任何限制.

android openlayers

dha*_*ran

2017 05-23

1
推荐指数

1
解决办法

2641
查看次数

OpenLayers：ModifyFeature不起作用

我只希望我可以修改我的台词。但是，尽管触发了onModificationStart，但将模式设置为RESHAPE，设置了正确的图层，并将createVertices设置为true，看起来就像是普通选择，没有任何修改的圆圈。

我已经停用了其他任何控件（大量的SelectFeatures和DrawFeatures，HighlightFeature等），但是什么也没有！我还查阅了OpenLayers-Example。

有什么需要注意的事情吗？

javascript openlayers

Nik*_*esl

lucky-day

1
推荐指数

1
解决办法

850
查看次数

OpenLayers为SVG图标着色

我一直在OpenLayers网站（http://openlayers.org/en/latest/examples/icon-color.html?q=color）上关注“图标颜色”示例。

这对png和jpg图像对我来说效果很好，但是当我切换为使用svg图像时，颜色完全不变。没有错误。颜色只是不变。

这是发生颜色变化的代码片段：

    /*set the colour*/
    var style = new ol.style.Style({
        image: new ol.style.Icon(/** @type {olx.style.IconOptions} */ ({
            anchor: [0.5, 0.5],
            src : 'img/icons/example.svg',
            color: '#8959A8'
        }))
    });

Run Code Online (Sandbox Code Playgroud)

任何建议将不胜感激！

jquery svg openlayers

Cha*_*e K

lucky-day

1
推荐指数

1
解决办法

1142
查看次数