turf-square

Calculates the minimum square bounding box for another bounding box.
<!doctype html>
<html lang="en">
  <head>
    <link rel="stylesheet" href="https://rawcdn.githack.com/openlayers/openlayers.github.io/master/en/v5.3.0/css/ol.css" type="text/css">
    <link rel="stylesheet" href="assets/css/styles.css" type="text/css">
    <script src="//cdn.jsdelivr.net/npm/@turf/turf@5/turf.min.js"></script>
    <script src="https://rawcdn.githack.com/openlayers/openlayers.github.io/master/en/v5.3.0/build/ol.js"></script>
    <script src="assets/js/helpers.js"></script>
    <title>Turf and OpenLayers 3 - Square</title>
  </head>
  <body>
    <div id="map" class="map"></div>
    <script type="text/javascript">

      var map = new ol.Map({
        layers: [
          new ol.layer.Tile({
            source: new ol.source.TileWMS({
              url: 'https://ahocevar.com/geoserver/wms',
              params: {
                'LAYERS': 'ne:NE1_HR_LC_SR_W_DR'
              }
            })
          })
        ],
        target: 'map',
        view: new ol.View({
          projection: 'EPSG:4326',
          center: [5, 47.5],
          zoom: 4
        })
      });

      var bbox_arr = [0, 45, 10, 50];

      var squared = turf.square(bbox_arr);
      var featureBbox = turf.bboxPolygon(bbox_arr);
      featureBbox.properties = {type: 'bbox'};

      var featureSquare = turf.bboxPolygon(squared);
      featureSquare.properties = {type: 'square'};

      var features = turf.featureCollection([
        featureBbox,
        featureSquare
      ]);

      console.log(features);

      var vectorLayerPolygons = new ol.layer.Vector({
        source: new ol.source.Vector({
          features: (new ol.format.GeoJSON({
            defaultData: 'EPSG:4326'
          })).readFeatures(features)
        }),
        style: (function() {
          return function(feature, resolution) {
            return [new ol.style.Style({
              stroke: new ol.style.Stroke({
                color: (feature.get('type') == 'bbox') ? 'red': 'black',
                width: (feature.get('type') == 'bbox') ? 4: 2
              })
            })];
          };
        })(),
        projection: 'EPSG:4326'
      });
      map.addLayer(vectorLayerPolygons);

    </script>
  </body>
</html>
square

turf-square

results matching ""

No results matching ""
