openlayers 根据起点和终点半径画圆弧

知识为进步之母,而进步又为富强之源泉。这篇文章主要讲述openlayers 根据起点和终点半径画圆弧相关的知识,希望能为你提供帮助。
原理:
1.先计算出圆心(结果有两个值一个在两个点的连线上面一个在两个点的下面)
2.选择圆心,计算两点之间指定个数点的坐标
3.将坐标集合以线的形式绘制出来(点越多越接近圆)

图上根据选择的圆心绘制了两个反方向的圆弧,中间横线为两点之间的连线用来验证坐标计算的


计算坐标的代码tool.js

function get_circle(point_s, point_e, radius, flag = true)
//返回结果变量let x0, y0, x1, y1
//计算过程if (point_e[0] == point_s[0])
y0 = y1 = (point_s[1] + point_e[1]) / 2let delta_y = (y0 - point_s[1]) ** 2let delta_x = .sqrt(radius ** 2 - delta_y)
x0 = point_e[0] - delta_x
x1 = point_e[0] + delta_x
else
let C1 = (point_e[0] ** 2 + point_e[1] ** 2 - point_s[0] ** 2 - point_s[1] ** 2) / 2 / (point_e[0] - point_s[0])
let C2 = (point_e[1] - point_s[1]) / (point_e[0] - point_s[0])
let A = 1 + C2 ** 2let B = 2 * (point_s[0] - C1) * C2 - 2 * point_s[1]
let C = (point_s[0] - C1) ** 2 + point_s[1] ** 2 - radius ** 2y0 = (-B + .sqrt(B * B - 4 * A * C)) / 2 / A
y1 = (-B - .sqrt(B * B - 4 * A * C)) / 2 / A
x0 = C1 - C2 * y0
x1 = C1 - C2 * y1

//判断返回哪个圆心
if (flag)
return [x1, y1]
else
return [x0, y0]




var rs_points = function rs_points(point_s, point_e, radius, dot_count, flag = true)
let line = []
let rs = get_circle(point_s, point_e, radius,flag)
let a = rs[0], b = rs[1]
let ad_len = 0
let y = 0
//计算x坐标的距离
ad_len =Math.abs(point_s[0] - point_e[0])

//根据需要打散的点数 计算每个x坐标
for (let i = 0; i < dot_count; i++)
let x = point_s[0]
if (point_s[1] > point_e[1])
x = x + ad_len / dot_count * i
else
x = x + ad_len / dot_count * i

//计算指定x点的y坐标
if (flag)
//如果返回的圆心上面
y = b + Math.sqrt(radius * radius - (x - a) * (x - a))
else
//如果返回的圆心下面
y = b - Math.sqrt(radius * radius - (x - a) * (x - a))

line.push([x, y])

line.push(point_e)
//返回所有在两点之间的圆弧上的点的集合
return line


exports.rs_points = rs_points

【openlayers 根据起点和终点半径画圆弧】


    推荐阅读