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方法。

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()方法计算。

  

/*格式化测量长度
*@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;
},

  

openlayers5实战--踩坑总结的更多相关文章

  1. Android 上传开源项目到 jcenter 实战踩坑之路

    本文微信公众号「AndroidTraveler」首发. 背景 其实 Android 上传开源项目到 jcenter 并不是一件新鲜事,网上也有很多文章. 包括我本人在将开源项目上传到 jcenter ...

  2. deno+mongo实战踩坑记

    自从 deno 1.0 发布以来,有关 deno 的文章很多,大多数都是在讨论怎么安装 deno .deno 有哪些特点 .deno 和 node 有哪些异同.deno是不是 node 的替代品等.咱 ...

  3. swagger实战踩坑1

    1.swagger error 有详细的错误信息 自己根据详细信息找问题 2.swagger error 无详细的错误信息 Controller是否重名=>重名,指定不同的   [Route(& ...

  4. nuxt.js实战踩坑记录

    读万卷书不如行万里路,必须实践出真理! 看官方文档安装项目vue init nuxt-community/starter-template <project-name>注意:这是新手项目不 ...

  5. node+express第一次实战踩坑记录

    读万卷书不如行万里路,必须实践出真理! 问题1:项目结构该搭建成什么样? 我一个node.js小白,完全没有想法!再见! 找找别人的项目看看别人放的什么项目结构,再结合自己的项目需求我来想想!

  6. Asp.Net Core 2.0 项目实战(5)Memcached踩坑,基于EnyimMemcachedCore整理MemcachedHelper帮助类。

    Asp.Net Core 2.0 项目实战(1) NCMVC开源下载了 Asp.Net Core 2.0 项目实战(2)NCMVC一个基于Net Core2.0搭建的角色权限管理开发框架 Asp.Ne ...

  7. 新书推荐《再也不踩坑的Kubernetes实战指南》

      <再也不踩坑的Kubernetes实战指南>终于出版啦.目前可以在京东.天猫购买,京东自营和当当网预计一个星期左右上架. 本书贴合生产环境经验,解决在初次使用或者是构建集群中的痛点,帮 ...

  8. NET Core2.0 Memcached踩坑,基于EnyimMemcachedCore整理MemcachedHelper帮助类。

    DotNetCore2.0下使用memcached缓存. Memcached目前微软暂未支持,暂只支持Redis,由于项目历史原因,先用博客园开源项目EnyimMemcachedCore,后续用到的时 ...

  9. 微信小程序踩坑集合

    1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=1476434678461 2:简易教程:https://mp.weixin.qq.com/debu ...

随机推荐

  1. C# ABP 允许跨域请求

    备注:无论有没有安装 apb zero模块,都可以使用本文的跨域 首先配置Web Api: 1. 在Web API项目下,安装包 Install-Package Microsoft.AspNet.We ...

  2. DECLARE_MESSAGE_MAP 宏

      此宏描述的头文件位置: afxwin.h 如果在 DECLARE_MESSAGE_MAP之后声明任何成员,则必须为其指定新的访问类型 (公共. private或 protected).说明:定义消 ...

  3. thinkphp 分页Pages

    位置: Thinkphp/Library/Think/Pages 或Page pages.class.php <?php // +-------------------------------- ...

  4. [日常] Go语言圣经-基于select的多路复用习题

    练习 8.8: 使用select来改造8.3节中的echo服务器,为其增加超时,这样服务器可以在客户端10秒中没有任何喊话时自动断开连接. reverb3.go package main import ...

  5. Spring MVC 不能正常获取参数的值

    最近在开发时遇到一个非常奇怪的问题,在tomcat8中使用Spring MVC框架,在Controller中的方法参数无法正常获取到相应的值,将tomcat版本换成7.0就解决了. 记录以下解决过程, ...

  6. 星系炸弹-2015省赛C语言A组第二题

    星系炸弹 在X星系的广袤空间中漂浮着许多X星人造“炸弹”,用来作为宇宙中的路标.每个炸弹都可以设定多少天之后爆炸.比如:阿尔法炸弹2015年1月1日放置,定时为15天,则它在2015年1月16日爆炸. ...

  7. Math Magic(完全背包)

    Math Magic Time Limit:3000MS     Memory Limit:32768KB     64bit IO Format:%lld & %llu Submit Sta ...

  8. Humble Numbers(hdu1058)

    Humble Numbers Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others) T ...

  9. LINQ to Objects系列(4)表达式树

    为了进一步加深对Lambda表达式的理解,我们需要掌握一个新的知识,Lambda表达式树,可能听名字看起来很高深和难以理解,但实际上理解起来并没有想象中那么难,这篇文章我想分以下几点进行总结. 1,表 ...

  10. Codeforces729D(SummerTrainingDay01-F)

    D. Sea Battle time limit per test 1 second memory limit per test 256 megabytes input standard input ...