修改openlayer中的多边形

时间:2019-06-01 01:50:07

标签: javascript

您好,这是我的代码“绘制多边形” -如何将多边形保存到JSON文件中?  单击此多边形将更改(变形)。但是,如果这样做,则将新的多边形保存到JSON文件中 这意味着: 阅读JSON文件多边形->显示多边形->例如更改区域名称或设置新点->保存在JSON文件中

有人可以帮助我吗:我使用openlayer 5

     /// function draw Polygone( already workt)

     function DrawSnappingZone(MapIdentifier){                
     var coordinatearray = [];            
    var snappingpoints = prompt("Wieviele Punkte sollen gesetzt         werden?");                       
     MapIdentifier.on('click', function(evt)          
       {                  
        var single_coordinate = ol.proj.toLonLat(evt.coordinate);     
        coordinatearray.push(single_coordinate);           
        //console.log(coordinatearray);                      
        console.log(coordinatearray.length);                  
        //DrawSnappingZone(coordinatearray, 5);      
        if (coordinatearray.length == snappingpoints)                        
        {   
        coordinatearray.push(coordinatearray[0]);           
            RouteAnzeigenAusKoordinaten(coordinatearray,       KarteGlobal_o, 'red');         
        }        
    });
  //function route draw
  function RouteAnzeigenAusPolyLine(PolyLine_s, AufKarte_o, Farbe_s)
  {      
  // Dekodierung der Polyline, die von OSRM geliefert wurde.
  // -> in Koordinaten Array
  var Koordinaten_v = DecodePolyline(PolyLine_s);

  // DEBUG AUSGABE
    console.log(Koordinaten_v);

    // Array anzeigen
   RouteAnzeigenAusKoordinaten(Koordinaten_v, AufKarte_o, Farbe_s)
}



 // AufKarte_o: Openlayers-Objekt auf dem es angezeigt werden soll
 // Farbe_s: Farbe als String (red, blue, green oder #0000FF)
 function RouteAnzeigenAusKoordinaten(Koordinaten_v, AufKarte_o,    Farbe_s)
  {
  // Wandeln der Array-Einträge in einen geometry-String
   var polyline = new ol.geom.LineString(Koordinaten_v)

// Wandlung der Polylines in ein Referenzkoordinatensystem
polyline.transform('EPSG:4326', 'EPSG:3857');

// Wandeln der geometry-Polyline in ein Feature
var polyfeat = new ol.Feature(polyline);

var vectorLayer = new ol.layer.Vector(
{
    source : new ol.source.Vector(
    {
        features : [polyfeat]
    })

    ,

    style : new ol.style.Style(
    {
        fill : new ol.style.Fill(
        {
            color : 'black'
        }),
        stroke : new ol.style.Stroke(
        {
            color : Farbe_s,
            width : 3
        })
    })

});

  // Den Vektorlayer der Karte hinzufügen.
  AufKarte_o.addLayer(vectorLayer);    
      }


function DecodePolyline(str, precision)
{
 var index = 0,
    lat = 0,
    lng = 0,
    coordinates = [],
    shift = 0,
    result = 0,
    byte = null,
    latitude_change,
    longitude_change,
    factor = Math.pow(10, Number.isInteger(precision) ? precision : 5);

while (index < str.length) {

    // Reset shift, result, and byte
    byte = null;
    shift = 0;
    result = 0;

    do {
        byte = str.charCodeAt(index++) - 63;
        result |= (byte & 0x1f) << shift;
        shift += 5;
    } while (byte >= 0x20);

    latitude_change = ((result & 1) ? ~(result >> 1) : (result >> 1));

    shift = result = 0;

    do {
        byte = str.charCodeAt(index++) - 63;
        result |= (byte & 0x1f) << shift;
        shift += 5;
    } while (byte >= 0x20);

    longitude_change = ((result & 1) ? ~(result >> 1) : (result >> 1));

    lat += latitude_change;
    lng += longitude_change;

    coordinates.push([lng / factor, lat / factor]);
   }

   return coordinates;
   };

0 个答案:

没有答案