Leaflet and TurfJS: Can not draw perpendicular lines using destination and bearing - leaflet

I am trying to draw perpendicular lines and I am using destination and rhumbDestination methods.
let home = turf.point([43.12831626497193, 1.259286403656006]);
L.circle(home.geometry.coordinates, {
color: 'purple',
fillColor: 'purple',
fillOpacity: 0.5,
radius: 20
}).addTo(map);
let destination;
destination = turf.rhumbDestination(home.geometry.coordinates, 400, 45, {units: 'meters'});
L.polyline([destination.geometry.coordinates, home.geometry.coordinates]).setStyle({color: 'green', weight: 5}).addTo(map);
destination = turf.rhumbDestination(home.geometry.coordinates, 400, -135, {units: 'meters'});
L.polyline([destination.geometry.coordinates, home.geometry.coordinates]).setStyle({color: 'green', weight: 5}).addTo(map);
destination = turf.rhumbDestination(home.geometry.coordinates, 400, 135, {units: 'meters'});
L.polyline([destination.geometry.coordinates, home.geometry.coordinates]).setStyle({color: 'red', weight: 5}).addTo(map);
destination = turf.rhumbDestination(home.geometry.coordinates, 400, -45, {units: 'meters'});
L.polyline([destination.geometry.coordinates, home.geometry.coordinates]).setStyle({color: 'red', weight: 5}).addTo(map);
But resulting lines are not perpendicular
Not perpendicular
I am using leaflet for visualization.
I have also tested with destination method, the same result.
While bearing is multiple of 90 the result is right.
destination = turf.rhumbDestination(home.geometry.coordinates, 400, 0, {units: 'meters'});
L.polyline([destination.geometry.coordinates, home.geometry.coordinates]).setStyle({color: 'green', weight: 5}).addTo(map);
destination = turf.rhumbDestination(home.geometry.coordinates, 400, -180, {units: 'meters'});
L.polyline([destination.geometry.coordinates, home.geometry.coordinates]).setStyle({color: 'green', weight: 5}).addTo(map);
destination = turf.rhumbDestination(home.geometry.coordinates, 400, 90, {units: 'meters'});
L.polyline([destination.geometry.coordinates, home.geometry.coordinates]).setStyle({color: 'red', weight: 5}).addTo(map);
destination = turf.rhumbDestination(home.geometry.coordinates, 400, -90, {units: 'meters'});
L.polyline([destination.geometry.coordinates, home.geometry.coordinates]).setStyle({color: 'red', weight: 5}).addTo(map);
Perpendicular
What I am doing wrong ? How can I draw perpendicular lines using leaflet and turfjs ?

it is a matter of coordinates order: Leaflet (like Google Maps) uses the [latitude, longitude] schema, while Turf follows the GeoJSON definition of [longitude, latitude], i.e. the equivalent of [x, y] on a geometrical plane.
Thanks to stegobit for answer

Related

why does yolov4 model(darknet) plot alots of bounding boxes around an object in one image?

I'm using yolov4.cfg for training on my dataset.(I'm using this github repository: https://github.com/Abhi-899/YOLOV4-Custom-Object-Detection)
after training 300 iteration, first I didn't get any bounding box for my images.
after searching about this problem, found that I should decrease the threshold. so I changed my 3 yolo layers so:
[yolo]
mask = 6,7,8
anchors = 12, 16, 19, 36, 40, 28, 36, 75, 76, 55, 72, 146, 142, 110, 192, 243, 459, 401
classes=3
num=9
jitter=.3
ignore_thresh = 0.07 ############## .7
truth_thresh = 1 ############ 1
random=1
scale_x_y = 1.05
iou_thresh= 0.213 ##############0.213
cls_normalizer=1.0
iou_normalizer=0.07
iou_loss=ciou
nms_kind=greedynms
beta_nms=0.6
max_delta=5
now, I get alots of bounding boxes!!!
what should I do?
can any one help me?
my output image is in below link:
https://drive.google.com/file/d/1Jm7pAk8a89JgtPPeXLCLhRW_6hpV68l1/view?usp=sharing

Highcharts to display area range and line chart with data from a CSV file

I would like to show a line chart with an area range. The data come from a CSV file.
1940/1/01,-0.07909, -0.1, 0.1
1940/2/01,-0.08183, -0.1, 0.1
1940/3/01,-0.0804, -0.1, 0.1
1940/4/01,-0.0799, -0.1, 0.1
1940/5/01,-0.0804, -0.1, 0.1
1940/6/01,-0.08111, -0.1, 0.1
1940/7/01,-0.08498, -0.1, 0.1
1940/8/01,-0.08403, -0.1, 0.1
1940/9/01,-0.08577, -0.1, 0.1
1940/10/01,-0.08265, -0.1, 0.1
1940/11/01,-0.07762, -0.1, 0.1
1940/12/01,-0.08243, -0.1, 0.1
(The range are fake values yet.)
I setup a fiddle here, in which somehow I guess that »series« part must be adapted. Somehow, in this section it must be specified that it needs to take the third and fourth column for the display:
series: [{
name: 'Temperature',
}, {
name: 'Range',
type: 'arearange',
lineWidth: 0,
linkedTo: ':previous',
color: Highcharts.getOptions().colors[0],
fillOpacity: 0.3,
zIndex: 0,
marker: {
enabled: false
}
}]
Thanks for any hints how this can be achieved.
You need to use seriesMapping property:
data: {
csv: document.getElementById('csv').innerHTML,
seriesMapping: [{
x: 0,
y: 1
}, {
x: 0,
low: 2,
high: 3
}]
}
Live demo: https://jsfiddle.net/BlackLabel/vtgdwb4p/
API Reference: https://api.highcharts.com/highcharts/data.seriesMapping

Fit of data as a cos^2?

I have collected this data of angles and intensities in lab to show Malus law so I have to fit the I as I=I0*cos^2(theta). I can't succeed with the cftool because it shows a curve totally different from my data, and I can't get a code that works. This is the data I got:
theta = [90, 110, 130, 135, 150, 170, 180, 190, 210, 225, 230, 250, 270, 290, 310,315,330, 350, 365, 370, 390]
I= [0.0030, 0.6240, 1.3060, 1.3320, 0.9610, 0.1900, 0.0160, 0.1970, 1.1250, 1.3480, 1.2900, 0.5660, 0.0030, 0.5750, 1.6170, 1.6760, 1.0850, 0.1380, 0.0940, 0.2250, 1.2340]
Thank you in advance for your help.
Well, I tried to code, but I couldn't get any near perfect match. I considered I0=1:
figure;
plot(theta, I)
hold on;
f = #(theta) cosd(theta)^2;
fplot(f, [0, 400])

Highcharts chart with risk color background

I would like to create a chart that has dynamic elliptical areas as background.
The background should visualize the risk and can be static but needs to render to different sizes of the chart of course.
Does anybody have an idea on how to achieve this with highcharts?
Thanks for your help. I solved the problem with a radial bBackground color.
chart : {
type: 'spline',
renderTo: chartData,
zoomType: 'x',
plotBackgroundColor: Highcharts.svg ? {
radialGradient: {
cx: 1.0,
cy: 0.0,
r: 1.5
},
stops: [
[0.0, 'rgba(255, 0, 0, 1.0)'],
[0.5, 'rgba(255, 193, 86, 1.0)'],
[1.0, 'rgba(44, 160, 44, 1.0)']
]
} : null
},
The radialGradient starts at 1.0, 0.0 (x, y) which is in the top right corner of the plot area.
I added three color gradient stops: red, yellow, green.
Hope this helps someone having the same problem. :)

highchart - How to change yaxis position on polar chart?

Please see the following chart:
http://jsfiddle.net/A9v4R/
I want that the yaxis labels will be where the -90 point, it's relocated because i changed the startangle.
The xaxis now is great for me but i need to change the position of the yaxis.
Please tell me how can i do that.
i tried to do:
yAxis: {
tickPositions: [-40, -35, -30, -25, -20, -15, -10, -5, 0],
labels: {
x: -13,
}
Thanks,
Tal.