Is it possible to dim or hide the "rest of the world" except one country on a standard leaflet.js map? Mabye overlay out with some kind of "inverted polygon" with the contours of the country? Any code examples or links would be appreciated.
Expanding #tmcw's answer ...
The secret is to draw a polygon using the property described in http://leafletjs.com/reference.html#polygon
You can also create a polygon with holes by passing an array of arrays
of latlngs, with the first latlngs array representing the exterior
ring while the remaining represent the holes inside.
The first polygon will be a rectangle as big as the map itself, the hole will be the country you want to highlight.
L.polygon( [outerBoundsLatLngs, latLngs] );
Here is a working example: http://jsfiddle.net/FranceImage/1yaqtx9u/
See the leaflet-maskcanvas and L.Mask plugins
Related
I have mapbox map with ~2000 points and I have voronoi polygons drawn around them vith turf.js, how can set boundaries around country so polygon don't stretch all over the world? I just want to mask/trim them and keep polygons around country borders.
What I already tried is using turf.js mask feature (https://turfjs.org/docs/#mask) but I lose all layers (there are no polygons/points anymore).
Here is my code on JSFiddle:
https://jsfiddle.net/eqxdjv6z/
Loop through each Border of each Voronoi cell and check if it crosses the outer shell.
If so, set the Intersection as a new edge of the Voronoi cell and delete all edges that are outside the meshing area.
Maybe this helps you, as well: https://discourse.mcneel.com/t/trim-voronoi-cell/78408
I see this has been answered, but I had the same issue and I believe there is a cleaner solution. You can simply use the turf/intersect function to clip the voronoi cells to another geometry. No manual border checking or anything.
I have a historical city map that I want to display using Leaflet.
I like to set the coordinates of this image to reflect the real world, e.g so I can click on the image and get the real coordinates.
I guess I can just make it an overlay to a real map, but there must be a better solution just define at what coordinates of the corners of the image.
For this image, the approx real world coordinates is NW: 60.34343, 18.43360, SE: 60.33761, 18.44819
My code, so far, is here:
http://stage1876.xn--regrund-80a.se/example3.html
Any ideas how to proceed? It feels like it there should be an easy way to do this?
Any help would be so appreciated!
EDIT: The implementation (so far) with tiles are optional. I could go for a one image-map as well.
If I have two shapes displayed on Bing-Maps can I do any set Math?
What I really want is to take two intersecting shapes, determine a 3rd shape for the intersection and then reduce the the original shapes to exclude the intersection.
I actually have the intersection shape so the key bit is taking a 'bite' out of the original shapes.
Reason for doing this is currently displaying the intersection as a third layer (to give a specific colour) produces a largely occluded map, what with part of the transparent shape1 and shape2 and the intersection all covering the same bit of the map.
If I could 'cut-down' the two main shapes only the intersection shape would colour/cover that part of the map.
I do not think there are out of the box solutions in the Bing Maps API. I have done something similar in the past with Bing Maps API and SqlGeography Class though. Its easy to loop through the points of our Bing Polygons, therefore we can plot them into SqlGeography Polygons or SqlGeometry Polygons.
You will need the Microsoft.SqlServer.Types.dll to make use of this class, but it is free with SqlExpress.(Note that you do not actually need SQL Server installed, you just need to reference the DLL)
You can use the SqlGeography Class (or SqlGeometry Class) to find intersecting shapes and points. Perhaps have a look at STIntersection Method, According to MSDN STIntersection will;
"Returns an object representing the points where a SqlGeography instance intersects another SqlGeography instance."
Once you have the object representing the shape were a SqlGeography instance intersects another, you know you need to somehow adjust any points from the compaired instances that lie withing the SqlGeography instnace returned by StIntersection.
Here is a simular question where Peter uses STDifference. To subtract the two shapes.
I'll provide you with a c# example I made quickly for the Intersection. I had a lot of trouble finding any code examples for anything that wasn't purely SQL Server based.
SqlGeography Shape1 = new SqlGeography();
SqlGeographyBuilder geographyBuilder1 = new SqlGeographyBuilder();
geographyBuilder1.SetSrid(4326);
geographyBuilder1.BeginGeography(OpenGisGeographyType.Polygon);
geographyBuilder1.BeginFigure(47.4275329011347, -86.8136038458706);
geographyBuilder1.AddLine(36.5102408627967, -86.9680936860962);
geographyBuilder1.AddLine(37.4928909385966, -80.2884061860962);
geographyBuilder1.AddLine(38.7375329179818, -75.7180936860962);
geographyBuilder1.AddLine(48.0932596736361, -83.7161405610962);
geographyBuilder1.AddLine(47.4275329011347, -86.8136038458706);// Remember last point in the polygon should match the first
geographyBuilder1.EndFigure();
geographyBuilder1.EndGeography();
Shape1 = geographyBuilder1.ConstructedGeography;
SqlGeography Shape2 = new SqlGeography();
SqlGeographyBuilder geographyBuilder2 = new SqlGeographyBuilder();
geographyBuilder2.SetSrid(4326);
geographyBuilder2.BeginGeography(OpenGisGeographyType.Polygon);
geographyBuilder2.BeginFigure(47.4275329011347, -86.8136038458706);
geographyBuilder2.AddLine(36.5102408627967, -86.9680936860962);
geographyBuilder2.AddLine(37.4928909385966, -80.2884061860962);
geographyBuilder2.AddLine(47.4275329011347, -86.8136038458706);
geographyBuilder2.EndFigure();
geographyBuilder2.EndGeography();
Shape2 = geographyBuilder2.ConstructedGeography;
SqlGeography IntersectedShape = Shape1.STIntersection(Shape2);
I believe you can draw shapes with the new GeoRSS feature - it supports line, boxes, polygons and circles. GeoRSS was designed as a lightweight, community driven way to extend existing feeds with geographic information. Also check out GeoJson
I am able to draw shapes using the UIBezierPath object. Now I want to identify different shapes drawn using this eg. Rectangle , Square , Triangle , Circle etc. Then next thing I want to do is that user should be able to select a particular shape and should be able to move the whole shape to different location on the screen. The actual requirement is even more complex , but If I could make this much then I can work out on the rest.
Any suggestion or links or points on how do I start with this is welcome . I am thinking of writing a separate view to handle every shape but not getting how do I do that..
Thank You all in advance !!
I recommend David Gelphman’s Programming with Quartz.
In his chapter “Drawing with Paths” he has a section on “Path Construction Primitives” which provides a crossroads:
If you use CGContextAddLineToPoint your user could make straight lines defined by known Cartesian points. You would use basic math to deduce the geometric shapes defined by those points.
If you use CGContextAddCurveToPoint your user could make curved lines defined by known points, and I’m pretty sure that those lines would run through the points, so you could still use basic math to determine at least an approximation of the types of shapes formed.
But if you use CGContextAddQuadCurveToPoint, the points define a framework outside of the drawn curve. You’d need more advanced math to determine the shapes formed by curves along tangents.
Gelphman also discusses “Path Utility Functions,” like getting a bounding box and checking whether a given point is inside the path.
As for moving the completed paths, I think you would use CGContextTranslateCTM.
I'm using Geoserver version 2.1.1, Postgres 9 and PostGIS 2.0
What I want to achieve should (i think!) be quite straight forward. I want to render on a map a line that represents the Great Circle between two cities on the earths surface.
My database contains the city locations represented as geography points defined as latitude and lonfitude pairs.
I have a layer defining an SQL view in Geoserver which retrieves a linestring (st_makeline) from the two coordinates for the specified cities. I'm having to type cast the geographies to geometries to get this to work.
But when I draw the returned line on a map what i get is a straight line and not the curved line that I am expecting.
Can someone tell me how I should be going about this?
Thanks!
PostGIS offers mainly "constructors" of the base geometries point, linestring and polygone, like ST_MakeLine.
And what yo uwant to do depends also on the coordinate reference system you use when displaying your map layers.
Here's a nice trick about great circles or parts of:
https://gis.stackexchange.com/questions/5204/curved-point-to-point-route-maps
Yours, Stefan
P.S. Here's some related stuff:
Drawing circles on a sphere
And here's some math:
http://www.mathworks.ch/matlabcentral/newsreader/view_thread/277881
I had a similar problem in cartodb (which also uses PostGIS); I wanted to get curved lines from straight lines. Maybe this post can help.