I have several markers in a map, I want to color the area inside the maps of a different color. I've tried L.multiPolygon , L.polygon, L.rectangle, but nothing does but I want. I guess my only option is to calculate the boundings of all the markers and draw the polygon based on these points, right ?
Here the code
<c:forEach var="marker" items="${markers}" varStatus="rowIndex">
var marker${rowIndex.index} = L.marker([${marker.lat},${marker.lng}],{icon: yellowIcon,title: '${marker.title}'}).addTo(mymap)
.bindPopup( "${marker.HTMLMarkerPopupCode}").openPopup();
storeCoordinate(${marker.lat}, ${marker.lng}, polygonPoints);
</c:forEach>
var polygon = L.polygon(polygonPoints);
polygon.setStyle({fillColor: '#0000FF'});
polygon.setStyle({color: 'red'});
polygon.setStyle({weight:1});
polygon.setStyle({fillOpacity: 0.5});
mymap.addLayer(polygon);
I would like to achieve something similar to this picture:
You can use L.Polygon as well.
Just do something like this:
var polygon = L.polygon([
marker1,
marker2,
marker3,
], {
fillColor: '#f03' // My custom color here
}
).addTo(mymap);
Not sure exactly what you are trying to achieve?
You might be interested in computing the Convex Hull of your markers area.
In that case, you should be able to find some JavaScript implementations on the Internet. E.g., you can look at how it is done in Leaflet.markercluster plugin: https://github.com/Leaflet/Leaflet.markercluster/blob/master/src/MarkerCluster.QuickHull.js
EDIT:
As for creating Convex Hull, you could also use Turf, in particular turf.convex.
Turf also provides you with plenty other functionalities, including turf.concave.
Related
Is there any way (or framework) which will allow me to krig my map. I have a few sensors on my map, each with a value (which is dynamic), and based on that value the surrounding area should be painted with some color.
I would like the map to look something like this:
Any help or idea, for any type of kriging, is more than welcomed.
I have a few geometries in map, the point is in polygon, I can highlight the polygon, but the point cannot be highlighted because of polygon enclose it. In new openlayers3 ol.featureoverlay has been removed, If have some ways to solve it, here is an example.
I updated that plunker to this fiddle to work against newer OL versions. It is not ready yet but perhaps it does what you need.
Basically I get a coefficient by comparing pointer coordinate with the coordinate of the closest feature. If this coefficient is short enough than add the feature to a ol.Collection.
To get the selected feature (for now, see https://github.com/openlayers/ol3/issues/4459) you can listen to collection changes:
collection.on('change:length', function(evt) {
if (collection.getLength() > 0) {
var feature = hoverInteraction.getFeatures().item(0);
// can be also
//var feature = collection.item(0);
}
});
Is it possible to make the symbolizer of a feature be a polygon?
Openlayers 3 has a ol.style.Circle and ol.style.RegularShape symbolizers for example. Is there something equivalent to a hypothetical ol.style.Polygon? Whereby you could make a dynamic symbolizer from multiple points?
The reason I want to do this is because I have markers on my map that are dynamically shaped depending on the data for that marker. It is possible to simply draw a ol.geom.Polygon at each point, but then they are not zoom independent. I want to have markers that are zoom independent, meaning that their size on the screen does not change when I zoom in or out.
And just to be clear, using raster images (for example in ol.style.Icon) is not possible. There are way too many markers in way too many shapes and colours in my project.
Yes, this is possible. ol.style.Style takes a geometry argument that you can use to overwrite the geometry that is used to render a feature.
var style = function(feature, resolution) {
// construct the polygon taking the resolution into account
var polygon = new ol.geom.Polygon(...);
return [
new ol.style.Style({
geometry: polygon,
stroke: ...
fill: ...
}),
];
};
Also see this question: Drawing a Speed Leader line in OpenLayers
We are currently using HighCharts for our typical bar, pie, line charts. But, we have been asked to plot some medical data that would end up resembling an irregular loop.
If I have an array of x,y points, would it be possible for me to draw this sort of graph with HighCharts? And, if so, can you point me to the right section of the documentation. I see that drawing things like rectangles and circles is possible, but I haven't found any info on drawing lines between arbitrary points.
I can see only three ways to achieve that, and none of them is easy, and have some limitations:
1) Use spline series with unsorted data - looks almost good, only tooltip doesn't work for unsorted data
2) Use scatter series with unsorted data - issue with tooltip is gone, but curves aren't smooth
3) Use renderer.path - doesn't have tooltip at all, and requires to add path manually.
And example of all three: http://jsfiddle.net/kEu3w/
I hope this question is beyond "read the manual". My task is simple, just to plot the following, but the plot in the middle should be a filled.contour plot:
http://gallery.r-enthusiasts.com/graph/Scatterplot_with_marginal_histograms_78
Background: I prefer filled.contour rather than hist2d. Because, I could use kernel smooth, so the plot for discrete data won't be too ugly. I also tried image() and then contour(), but the number on contour is not clear and no indication about the color.
My problem: in filled.contour function, it uses layout() for filledcontour() plot and rect() plot (color bar). However, I use layout() in the outside code to organize 2 histogram and one filled.contour plot. Looks like, the layout outside is shadowed by filled.contour(). I am not sure how R deal with this problem. Should I rewrite filled.contour() somehow?
Thanks
If you look at the help page ?filled.contour you will see that it also mentions another function called .filled.contour (extra . at the front) which does just the bare bones plotting without calling layout and causing the problems that you see. You need to do more of the checking and prelim work, but you should be able to do what you want using .filled.contour for the main plot and setting up the layout yourself.