我们有一个简单的需求，点击“面积统计”按钮，需要对地图上指定矢量图层进行面积计算并在地图上弹出气泡提示框显示出来，效果如下
我参考的是openlayers官方的测量效果Demo
计算的方式也非常简单，直接使用getArea方法就可以了，不过需要注意是投影的问题
要计算面积首先就是要确保投影与Map地图的投影保持一致，否则出现计算结果不一致的问题
下面代码说明使用方法，首先导入模块中的方法：
import { getArea } from 'ol/sphere';
getArea方法有两个参数，第一个重要的参数就是Polygon Geometry，也就是多边形对象，获取的方法也在下面
就是从数据源对象中（我的是getSource方法）获取特征的第0个（因为我的当前的图层只有一个，如果有多个可能需要getFeatureById或者循环过滤的方式了）使用getGeometry方法获取
接着就是设置一下projection投影了，这个参数的默认值是EPSG:3857，我的地图投影是EPSG:4326。 如果是其他投影的话就需要特殊处理了。
返回值的单位是平方米
const geom = this.layer.getSource().getFeatures()[0].getGeometry()const area = getArea(geom,{projection:'EPSG:4326'});
官网对返回值的处理
// 10000 平方米=0.01 平方千米// 1000000 平方米=1 平方千米// 这里的 * 100取整后再 / 100 是为了保留小数点后面两位（小技巧）if (area > 10000) {output = Math.round((area / 1000000) * 100) / 100 + ' ' + 'km<sup>2</sup>';} else {output = Math.round(area * 100) / 100 + ' ' + 'm<sup>2</sup>';}
地图上气泡的显示效果是用的官方demo的createMeasureTooltip函数，就是添加的Overlay
