How to draw a leaflet polyline with relative length to another leaflet polyline - leaflet

I try to create a leaflet polyline on top of another polyline. The first polyline is a simple one between two coordinates. Its 500 miles long. The second one should have the exact same path, but a configurable length, e.g. 100 miles, 237 miles, etc. Second line should be drawn with same path, just shorter.
If second polyline get coordinates:
polyline2.coord1 = [polyline1.coord1.lat, polyline1.coord1.lng]
polyline2.coord2 = [(polyline1.coord1.lat + polyline1.coord2.lat) / 2, (polyline1.coord1.lng + polyline1.coord2.lng) / 2]
Second polyline is perfectly on top of first polyline. But the length is always 50%, in example case, 250 miles. Because the above calculation gets the exact point in the middle.
How do I get points/coords between polyline1.coord1 & polyline1.coord2, e.g. 100 miles from coord1?
So what I need to calculate is the 2nd coordinate set of polyline2. And I am out of ideas to go beyond the exact middle point solution. Some help would be appreciated much.

Related

How to show building floors in Deck.gl/react-map-gl

So I'm currently working on Deck.gl and React and I need to load a geojson file which has an additional property named "floors" or something similar which tells how many floors the building has.
Is there any way to extrude alternating floors horizontally just a little bit so that it looks like a floor edge like some of the buildings in this image (although most of them just go thinner at the top). I tried searching the deck.gl but there is no such thing. I looked up and found MapBox-gl-js has something called an extrusion-base-height which lets you add polygon above another but there is no such thing as extruding horizontally to make 1 floor thinner and then back to the original size. This would give and edge whenever a new floor starts.
I have scoured the docs for deck.gl but couldn't find any thing on extruding horizontally or in another sense changing the polygon area/size so that I can draw multiple size polygons on the same spot.
Another clear picture of what I'm trying
Things I want to do.
The red polygon is tilted. Need to make it's orientation the same as the green one and reducing it's area at the same time.
Move the red polygon base at the top of the green polygon.
The test data I'm using is given below,
var offset = 0.00001;
var data = [{
polygon: [
[-77.014904,38.816248],
[-77.014842,38.816395],
[-77.015056,38.816449],
[-77.015117,38.816302],
[-77.014904,38.816248]
],
height: 30
},
{
polygon: [
[-77.014904 + offset ,38.816248],
[-77.014842 - offset, 38.816395 - offset],
[-77.015056 - offset, 38.816449 - offset],
[-77.015117 + offset, 38.816302],
[-77.014904 + offset, 38.816248]
],
height: 40
}
];
EDIT:- I think the proper way would be to convert longitude/latitude to Cartesian Coordinates, get the vectors to the 4 corners of the polygon translate the vectors to move towards the center by the offset amount then convert back. But this would only work with quad/rectangle polygon, for buildings that are made up of multiple quads I'd need another way.
If I'm understanding correctly, your problem boils down to: given a polygon (the footprint of the lower part of the building), generate a slightly smaller version of the same polygon, centered within it.
Fortunately, this is really easy using Turf's transformScale method.
So your steps will be:
Convert your polygon data into GeoJSON. (Which I assume you have some mechanism to do, in order to display it in Mapbox-GL-JS in the first place.)
Generate a smaller polygon using turf.transformScale(base, 0.9)
Add the new polygon with map.addSource
Display the new polygon with map.addLayer, setting the extrusion base height etc as required.

Get Latitude and Longitude of upper left corner of a Bing Map

I programatically create requests to dev.virtualearth.net (Bing static maps).
I know the following values:
Center Point (Latitude & Longitude)
Zoom Level
Map Size (X pixels, Y pixels)
After I recieved the map as a bitmap, how do I determine the Coordinates (Latitude and Longitude) of the upper left corner (basically the very first pixel) and the lower right corner (the very last pixel)?
I just need some suggestions or some pseudo code. Note, that while I know the Center Point, Zoom Level and Map Size, these aren't the same for every request.
Thank you.
You will need to do tile math: https://msdn.microsoft.com/en-us/library/bb259689.aspx
You will need to do the following:
Pass the center point into LatLongToPixelXY method to get the center global pixel value.
Knowing the pixel dimensions of the static image you created, subtract half the width from the x value of the center global pixel value. Do the same with the height and y.
This gives you a new pixel value, pass it into the PixelXYToLatLong to get the coordinate for the top left corner.
That's it :)
I have an old code sample that does this, but retrieves the static image using the old SOAP services rather than the REST services. You can find the blog post here: https://rbrundritt.wordpress.com/2008/10/25/ve-imagery-service-and-custom-icons/ See the LatLongToPixel function code that is half way down the post. That does the above three steps.

Why points above 85N or below -85S are not shown on the iPhone map?

I need to represent on the map (iPhone) some points such as (88, 60) or (90, 55), but the custom annotations representing these points get deallocated. I also noticed that these points are not actually displayed on the google map, they are somehow above the visible map. This happens for any point that is above 85 deg. N latitude or -85 deg. S latitude.
I know it's a really old post, but just to answer your question.
Most (allmost all) commercial maps are displayed in the mercator projection. This is what you see in mapKit or on google maps. This means that the latitude and longitude lines run horizontal and vertical.
If you would change this to for instance polar project (world from the top) it would become way to difficult to calculate the postion of objects because the lat and long lines converge rapidly...
So it's just for ease of use....

iOS - Center position of two coordinates

I would like to create a MKCoordinateRegion (to zoom to the good region on the map) from the northeast and southwest points given by Google. For that I need to compute the coordinate of the center between these two coordinates. Any clue? I could do simple math but I will have problems with the equator...
Thanks!!!
Assuming you mean anti-meridian and not the equator then here goes (While all this works on a flattened map and should be good enough for your purpose, it's completely bung on a sphere. see note at the bottom).
What I've done in other cases is start at either point, and if the next point is more than 180 degrees to the east, I convert it so that it is less than 180 to the west like so
if(pointa.lon - pointb.lon > 180)
pointb.lon += 360:
else if (pointa.lon - pointb.lon < -180)
pointb.lon -= 360
At this time pointb.lon might be an invalid longitude like 190 but you can at least work out the mid-point between pointa and point b because they will be on a continuous scale, so you might have points 175 and 190. Then just get the mid-point between them as 182.5, then convert that to make sure it is within the usual limits and you get -177.5 as the latitude between the two points. Working out the latitude is easy.
Of course on a sphere this is wrong because the midpoint between (-180,89) and (180,89) is (0*,90) not (0,89).
* = could be anything
Also, couldn't you just zoomToRect made with the defined corners? It'd save you doing this calculation and then next one which would be to work out what zoom level you need to be at when centered on that point to include the two corners you know about. Since the Maps app doesn't appear to scroll over the anti-meridian I assume MKMapview can't either so your rectangle is going to have to have the northeast coord as the top right and the southwest as the bottom left.
This SO post has the code to zoom a map view to fit all its annotations.

MKCircle - Stroke Width equivilant to meters

I have a MKCircle. I would like to be able to set a stroke width equivilant to meters not points. So that I can draw an overlay with both radius in meters of a stroke width in meters.
I understand that the points to meters relationship changes whenever the map is zoomed. I have a very low annotation count (1) right now so removing and readding it on zoom should be OK if I can figure out a way to calculate the desired stroke width in points for a meter distance at a given map state.
The first thing to consider is whether you really want to do this: the line could wind up being invisibly thin if the user zooms out.
The only way I can see to do it is to create an appropriately-sized MKCoordinateRegion using MKCoordinateRegionMakeWithDistance and then use MKMapView's convertRegion:toRectToView: to convert it to a CGRect, from which you can read out the width/height to calculate the appropriate line width.