Question

我在Geoserver上存储了一个geojson文件（大约150个多边形），并在OpenLayers（v4.6.4）中使用WFS调用了该层。为了给每个多边形着色，我使用了一个基于此示例的函数： http://openlayersbook.github.io/ch06-styling-vector-layers/example-07.html

每个多边形的颜色基于存储在我的数据库postgresql中的值。它可以正常工作，但是对我的应用程序来说太慢了（在本地大约4秒，在远程服务器上超过10秒）。

有人有提高性能的想法吗？要使用WMS服务而不是WFS？要为矢量层添加标题？

这是我对图层的定义：

var format = 'image/png';

var projection = new ol.proj.Projection({
          code: 'EPSG:4326',
          units: 'degrees',
          axisOrientation: 'neu'
      });

var map = new ol.Map({
        controls: ol.control.defaults({
          attribution: false
        }).extend([mousePositionControl]),
        overlays: [overlay],
        target: 'map',
        layers: [
          district_layer
        ],
        view: new ol.View({
           projection: projection
        })
      });


//definition and adding of the district layer
          var format_geojson = new ol.format.GeoJSON();
          var districtSource = new ol.source.Vector({
            format: format_geojson,
            url : 'http://'+ $location.host() + ':8080/geoserver/project/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=project:District_07072018&outputFormat=application%2Fjson',
            strategy : ol.loadingstrategy.bbox

          });
          var district_layer = new ol.layer.Vector({
            renderMode: 'image',
            source: districtSource,
            style: styleFunction
          });
          map.addLayer(district_layer);
          //when the layer is ready to be customize
          var key = districtSource.on('change', function(event) {
            if (districtSource.getState() == 'ready') {
              var district_value_object = {};
            //if ($scope.district_name_list && $scope.value) {
              if ($scope.district_name_list && $scope.color_value[99]) {
                for (var i=0;i<$scope.district_name_list.length;i++){
                  district_value_object[$scope.district_name_list[i].eng_name] = $scope.color_value[99][i]; 
                }
              }
              district_layer.getSource().forEachFeature(function(feature) {
                var district_eng_name = feature.get('Eng_Name');
                if (district_value_object[district_eng_name]) { //value
                  //set the feature name to be able to get it in the styleFunction
                  feature.set('Value', district_value_object[district_eng_name]);
                }
              });
            }
          });

任何建议的帮助将不胜感激。谢谢。

如何从Openlayers中的表格数据快速为图层着色

0 个答案: