OpenLayers read.JSON,带角度

OpenLayers read.JSON,带角度,json,angular,openlayers,Json,Angular,Openlayers,我想从url读取并显示一个json文件:“geodat.geojson”。 问题是,我可以用OSM显示法线贴图,但geoJSON文件将不会被读取和显示。 有人能帮我吗 initMap() { this.map = new Map({ target: 'map', layers: [ new TileLayer({ source: new OSM({ attributions: [] }) }), new VectorLayer({

我想从url读取并显示一个json文件:“geodat.geojson”。 问题是,我可以用OSM显示法线贴图,但geoJSON文件将不会被读取和显示。 有人能帮我吗

initMap() {
this.map = new Map({
  target: 'map',
  layers: [
    new TileLayer({
      source: new OSM({
        attributions: []
      })
    }), new VectorLayer({
      source: new VectorSource({
        url: 'geodat.geojson',
        format: new GeoJSON()
      }),
      style: new Style({
        fill: new Fill({
          color: 'rgba(255,255,5,0.8)'
        }),
        stroke: new Stroke({
          color: 'rgba(255,255,255,0.8)'
        })
      })
    })
  ], view: new View({
    center: [0, 0],
    zoom: 2
  })

您需要指定geojson的相对路径,设置投影,并根据要素类型设置要素样式

var styles = {
  'Point': new Style({
    image: new Icon({
      src: './marker.png'// should be in same directory
    })
  }),
  'LineString': new Style({
    fill: new Fill({
      color: '#3985da'
    }),
    stroke: new Stroke({
      color: '#3985da',
      width: 2
    }),
    image: new Circle({
      radius: 7,
      fill: new Fill({
        color: '#ffcc33'
      })
    })
  }),
  'Polygon': new Style({
    stroke: new Stroke({
      color: '#3985da',
      width: 2
    }),
    fill: new Fill({
      color: 'rgba(57, 133, 218, 0.4)'
    }),
  })
};
var styleFunction = function (feature) {
  return styles[feature.getGeometry().getType()];
};
initMap() {
this.map = new Map({
  target: 'map',
  projection: 'EPSG:4326',
  layers: [
    new TileLayer({
      source: new OSM({
        attributions: []
      })
    }), new VectorLayer({
      source: new VectorSource({
        url: './geodat.geojson',//if geojson is in same directory
        format: new GeoJSON()
      }),
      style: styleFunction
    })
  ], view: new View({
    center: [0, 0],
    zoom: 2
  })

能够从Openlayers 6.1.1中的上述代码中获得所需的结果

您能分享“geodat.geojson”的位置吗?它是否在同一目录中?当我添加投影时,将显示此失败:类型为“{url:string;format:GeoJSON;projection:string;}”的参数不能分配给类型为“Options”的参数。Object literal只能指定已知属性,并且“Options”类型中不存在“projection”。明白了。它在没有投影的情况下工作吗?您正在使用哪个版本的openlayers?不,它不起作用。im使用的是最新版本v6.1.1当我在我的navigator中打开控制台时,将显示此故障:GET 404(未找到)geojson位于何处?