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方法。
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实战--踩坑总结的更多相关文章
- Android 上传开源项目到 jcenter 实战踩坑之路
本文微信公众号「AndroidTraveler」首发. 背景 其实 Android 上传开源项目到 jcenter 并不是一件新鲜事,网上也有很多文章. 包括我本人在将开源项目上传到 jcenter ...
- deno+mongo实战踩坑记
自从 deno 1.0 发布以来,有关 deno 的文章很多,大多数都是在讨论怎么安装 deno .deno 有哪些特点 .deno 和 node 有哪些异同.deno是不是 node 的替代品等.咱 ...
- swagger实战踩坑1
1.swagger error 有详细的错误信息 自己根据详细信息找问题 2.swagger error 无详细的错误信息 Controller是否重名=>重名,指定不同的 [Route(& ...
- nuxt.js实战踩坑记录
读万卷书不如行万里路,必须实践出真理! 看官方文档安装项目vue init nuxt-community/starter-template <project-name>注意:这是新手项目不 ...
- node+express第一次实战踩坑记录
读万卷书不如行万里路,必须实践出真理! 问题1:项目结构该搭建成什么样? 我一个node.js小白,完全没有想法!再见! 找找别人的项目看看别人放的什么项目结构,再结合自己的项目需求我来想想!
- 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 ...
- 新书推荐《再也不踩坑的Kubernetes实战指南》
<再也不踩坑的Kubernetes实战指南>终于出版啦.目前可以在京东.天猫购买,京东自营和当当网预计一个星期左右上架. 本书贴合生产环境经验,解决在初次使用或者是构建集群中的痛点,帮 ...
- NET Core2.0 Memcached踩坑,基于EnyimMemcachedCore整理MemcachedHelper帮助类。
DotNetCore2.0下使用memcached缓存. Memcached目前微软暂未支持,暂只支持Redis,由于项目历史原因,先用博客园开源项目EnyimMemcachedCore,后续用到的时 ...
- 微信小程序踩坑集合
1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=1476434678461 2:简易教程:https://mp.weixin.qq.com/debu ...
随机推荐
- C# fileUpload视频上传
要实现大文件上传必须配置webConfig例如: <system.web> <compilation debug="true" targetFramework=& ...
- .NET Core类库中读取配置文件
最近在开发基于.NET Core的NuGet包,遇到一个问题:.NET Core中已经没有ConfigurationManager类,在类库中无法像.NET Framework那样读取App.conf ...
- C#进行数据筛选(二)
这里介绍LINQ+Lambda表达式进行数据筛选的方式 这里是第一种方式,还是使用了if条件语句去判断,根据选择的条件去筛选出我所需要的数据 public GxAnaly SelectDay(stri ...
- Code Signal_练习题_stringsRearrangement
Given an array of equal-length strings, check if it is possible to rearrange the strings in such a w ...
- python学习之老男孩python全栈第九期_day008作业
1. 文件a.txt内容:每一行内容分别为商品名字,价钱,个数,求出本次购物花费的总钱数apple 10 3tesla 100000 1mac 3000 2lenovo 30000 3chicken ...
- switch的用法
switch case 语句有如下规则: switch 语句中的变量类型可以是: byte.short.int 或者 char.从 Java SE 7 开始,switch 支持字符串 String 类 ...
- H5音乐播放器源码共享
由于博客云后台管理工具写起东西来实在难受,所以直接共享源码了! https://pan.baidu.com/s/1XeRxlk7iv5qt1f16s64F9w H5源码!暂时只支持手机适配,电脑端 ...
- Kendo Grid控件中将枚举值转为枚举名显示
我们在开发过程中经常会遇到需要将枚举值转换成名称进行显示的情况.如下我们有这样一个数据源对象: var users = [ {id: 1, name: "similar1", st ...
- 活字格Web应用平台学习笔记2-基础教程-开始
今天先学活字格第一个教程,开始. 目标是能够用活字格创建一个简单的Web页面. 哈哈,简单,跟Excel一样,做单元格输入.合并.文字居中.加底色.加图片,然后发布. 然后就真的生成了一个Web页面! ...
- 使用 jQuery Ajax 异步登录,并验证用户输入信息(maven)
使用 jQuery Ajax 异步登录,并验证用户输入信息(maven) 本篇内容: (1)上一篇是使用同步的请求实现登录,并由 Servlet 决定登陆后下一步做哪些事情,本篇使用 jQuery A ...