openlayers5实战--踩坑总结

1.接口返回圆心坐标和半径，直接通过new Circle(center,radius)添加圆形feature变小问题。

　　解决办法：

　　new  Feature()的geometry参数不能直接赋值new  Circel()得到的geometry，

　　要通过‘ol/geom/Polygon.js’中的fromCircle方法将new  Circel()得到的geometry转化一遍然后赋值给new  Feature()的geometry。

　　另：如果接口直接返回的坐标点画圆，则使用‘ol/geom/Polygon.js’中的circular方法。

?

1 2 3 4 5 6 7 8 9 10

import {circular as circularPolygon, fromCircle as fromCirclePolygon} from CC;eg1:let lng = parseFloat(d[0].lng); let lat = parseFloat(d[0].lat); let radius = parseFloat(d[0].radius); let circle = new Circle(transform([lng, lat], 'EPSG:4326', 'EPSG:3857'), radius);feature = new Feature({    position: transform([lng, lat], 'EPSG:4326', 'EPSG:3857'),    radius: radius,    type: 'circle',    id: 'N',    geometry: fromCirclePolygon(circle) })eg2：let lng = item.coordinateList[0].lng;let lat = item.coordinateList[0].lat;let radius = item.coordinateList[0].radius;let circle4326 = circularPolygon([lng, lat],radius,64);let circle3857 = circle4326.clone().transform('EPSG:4326', 'EPSG:3857');feature = new Feature(circle3857);

　　

2.测距不准问题。

　　解决办法：

　　使用'ol/sphere.js'中的getLength()方法计算。

　　

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14

/*格式化测量长度        *@params line:  type geometry        */       formatLength (line) {         //定义长度变量         let length = getLength(line);         let output;         if (length > 100) {           output = `${(Math.round(length / 1000 * 100) / 100)} 公里`;         } else {           output = `${(Math.round(length * 100) / 100)} 米`;         }         return output;       },