How to use the @terrestris/ol-util/dist/MeasureUtil/MeasureUtil.formatArea function in @terrestris/ol-util

To help you get started, we’ve selected a few @terrestris/ol-util examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github terrestris / react-geo / src / Button / MeasureButton / MeasureButton.tsx View on Github external
if (this._feature) {
      let output;
      let geom = this._feature.getGeometry();

      if (geom instanceof OlMultiPolygon) {
        geom = geom.getPolygons()[0];
      }

      if (geom instanceof OlMultiLinestring) {
        geom = geom.getLineStrings()[0];
      }

      let measureTooltipCoord = geom.getLastCoordinate();

      if (measureType === 'polygon') {
        output = MeasureUtil.formatArea(geom, map, decimalPlacesInTooltips);
        // attach area at interior point
        measureTooltipCoord = geom.getInteriorPoint().getCoordinates();
      } else if (measureType === 'line') {
        output = MeasureUtil.formatLength(geom, map, decimalPlacesInTooltips);
      } else if (measureType === 'angle') {
        output = MeasureUtil.formatAngle(geom, map, decimalPlacesInTooltips);
      }

      this._measureTooltipElement.innerHTML = output;
      this._measureTooltip.setPosition(measureTooltipCoord);
    }
  }
github terrestris / react-geo / src / Button / MeasureButton / MeasureButton.tsx View on Github external
} = this.props;

    if (!_isEmpty(this._feature)) {
      let geom = this._feature.getGeometry();

      if (geom instanceof OlMultiPolygon) {
        geom = geom.getPolygons()[0];
      }

      if (geom instanceof OlMultiLinestring) {
        geom = geom.getLineStrings()[0];
      }

      const value = measureType === 'line' ?
        MeasureUtil.formatLength(geom, map, decimalPlacesInTooltips) :
        MeasureUtil.formatArea(geom, map, decimalPlacesInTooltips);

      if (parseInt(value, 10) > 0) {
        const div = document.createElement('div');
        div.className = `${measureTooltipCssClasses.tooltip} ${measureTooltipCssClasses.tooltipStatic}`;
        div.innerHTML = value;
        const tooltip = new OlOverlay({
          element: div,
          offset: [0, -15],
          positioning: 'bottom-center'
        });
        map.addOverlay(tooltip);

        tooltip.setPosition(coordinate);

        this._createdTooltipDivs.push(div);
        this._createdTooltipOverlays.push(tooltip);
github terrestris / react-geo / src / Button / MeasureButton / MeasureButton.spec.tsx View on Github external
];
        const mockPolyFeat = new OlFeature({
          geometry: new OlGeomPolygon([polyCoords])
        });

        wrapper.setProps({
          measureType: 'polygon'
        });

        instance._feature = mockPolyFeat;
        instance.addMeasureStopTooltip(coordinate);

        expect(instance._feature).toBeDefined();
        expect(instance._feature.getGeometry()).toBeDefined();

        const value = MeasureUtil.formatArea(instance._feature.getGeometry(), map, 2);
        expect(value).toBe('99.78 m<sup>2</sup>');
      });