Good afternoon! I need to change the icon of a marker in the map here with some JS code, but I don't know how can I achieve that using the images array.
I tried this but it doesn't work. Any help will be appreciated!
The problem was that I wasn't declaring the size of the image. Here is the code that worked for me.
var res = {size: 40};
res.url = images[1];
return res;
Related
I was wondering if there is a way to get the bounding box of not the complete layer, but only the part of the layer that is visible in the current zoom level of the map?
So, I need to get the screen coordinates of the bounding box of the layer drawn on the screen. I could not find a way to achieve this.
EDIT:
Unfortunately this is not solving my problem. This is exactly the point that I got to latest and in some cases it is not working. Since stackoverflow does not allow me to upload images because of my reputation I will try to describe:
Imagine that I have a path which is crossing the screen almost parallel to y axis, however outside the screen it is at least x-axis long. In this case the solution proposed will return min and max screen coordinates for x axis, where it needs to be a short interval that it is crossing the screen. In a way I need the bounding box of the visible part of the layer.
EDIT 2:
Thank you all for your answers. I tried to use "getFeaturesInExtent" function, but I get an error saying: "Uncaught TypeError: undefined is not a function". I am using the latest OpenLayers which is version 3.4.0. I suppose I am getting this error because this function is not implemented in this version.
The way I am using is the following:
var mapExtent = map.getView().calculateExtent(map.getSize());
var features = result.getSource().getFeaturesInExtent(mapExtent);
What kind of solution do you suggest for me? (I tried to use master version downloading ZIP from: https://github.com/openlayers/ol3, but the map did not work in this case.)
Thanks again!
I think the only things what you need is the extent of the view and the extent of the layer and the ol.extent.getIntersection() Function.
You can get the Extent of the current View by f.ex
map.getView().calculateExtent(map.getSize());
The global extent of your layer by
`layer.getExtent()`.
And the intersecting Extent with.
ol.extent.getIntersection(extent1, extent2,opt_extent)
Should return the intersecting extent of the current view and your layer. Be aware that not all mentioned functions are stable.
I found the solution in the following:
var mapExtent = map.getView().calculateExtent(map.getSize());
var intersectedFeatures = [];
for (var i = 0; i < points.length; i++){
if(ol.extent.containsCoordinate(mapExtent, points[i]))
intersectedFeatures.push(points[i]);
}
var visibleLayerExtent = ol.extent.boundingExtent(intersectedFeatures);
Thank you all for the help!
Does anyone know if you are able to set the colour of the text for a vertex label in JUNG.
I'm using the Visualisation Viewer and can seem to be able to set the colour for everything else.
vv = new VisualizationViewer<String,Integer>(treeLayout, new Dimension(410,557));
Transformer<String,Paint> vertexPaint = new Transformer<String,Paint>() {
public Paint transform(String b) {
return Color.orange;
}
};
vv.setBackground(Color.white);
vv.getRenderContext().setEdgeShapeTransformer(new EdgeShape.Line());
vv.getRenderContext().setVertexLabelTransformer(new ToStringLabeller());
vv.getRenderContext().setVertexFillPaintTransformer(vertexPaint);
//vv.getRenderContext().setVertexFontTransformer(vertexFont);
// add a listener for ToolTips
vv.setVertexToolTipTransformer(new ToStringLabeller());
vv.getRenderContext().setArrowFillPaintTransformer(new ConstantTransformer(Color.WHITE));
The DefaultVertexLabelRenderer and the DefaultEdgeLabelRenderer extend JLabel (it is similar to the way cell renderers work in JTable and JTree).
By default, it uses the foreground color of the VisualizationViewer to draw the label text.
vv.setForegroundColor(Color.red);
will make all of your labels red.
This approach is less expensive than making all of the labels parse HTML.
Sorry that the solution is so obscure.
Additionally, since the default renderers extend JLabel, the use of html is the same as it is for JLabel. There are good online resources to show examples of using html with javax.swing. What's missing is documentation to make the connection between using html in JUNG and using html in javax.swing.
You can use HTML in the label to specify the color; an example is here: https://stackoverflow.com/a/2017576/664856
In your case,
vv.getRenderContext().setVertexLabelRenderer(new DefaultVertexLabelRenderer(Color.RED));
should work (if you wanted selected vertex to be Red). I tested it myself. This applies to the selected vertex.
Upon inspection of code, I would have to believe that the link I provided does correctly work for those vertices which are not selected, but I did not actually try implementing that link.
I'm using border-radius:50%;
This doesn't work in IOS4?
but http://caniuse.com/#search=border-radius says it does?
Huh? Whats going on?
In IOS4,
It appears that it doesn't support border-radius:50%?
Therefore had to come up with some JS to work out the percentage in Pixels.
Something Like:
var radius = circleWidth / 2;
$jq('.circle').css('border-radius', radius + "px")
Doesn't appear to be documented anywhere either.
According to css3.info: percentages refer to the corresponding dimensions of the border box.
Does you box have a defined height/width?
Does it work on other mobile browsers?
Maybe you need to add the -webkit- prefix to it.
I'm trying to get a draggable image in Dart. Though setting the draggable bool of my image doesn't work.
image = new ImageElement();
image.src = ImageSourceByName(name);
image.on.load.add((event) {Context.drawImage(image, 10, 10, CARD_SMALL_WIDTH, CARD_SMALL_HEIGHT);});
image.draggable = true;
(Note: Context is the 2D context I get from my Canvas.)
The drawing works perfectly, I can see my card, though I can't drag it around. I'm pretty new to Dart, so it might be something obvious, though I can't find any tutorial explaining it.
You're using an ImageElement as the source to paint something on your CanvasElement.
Once the pixels are on the canvas(through drawImage()), your image data is not an HTMLElement but, well, pixels :)
The draggable attr, however, is an attribute of an HTMLElement.
If you add the image to your document, you'll notice that you can study the behaviour of draggable, like this:
document.body.nodes.add(image);
If you 'only' want to have draggable images, you can take it from there and maybe look at http://www.whatwg.org/specs/web-apps/current-work/multipage/dnd.html
Otherwise, if you want stuff on a canvas to be draggable, thats a different(more complicated?) story.
I have a set of locations that I want to bring up, individually through ajax calls, and some of them aren't within the current bounds of the map. Is there a way to move the map so the marker is in view?
I don't need it to be in the center, just as long as it's in view.
I figured it out after some research. I'd still be curious to know how to NOT have to center if the marker is visible on the map.
var centerpoint = new google.maps.LatLng(lat_value, long_value);
Gmaps4Rails.map.setCenter(centerpoint)
edit: Found answer to how to not center map every time.
Pseudo code version.
1. Get values from Gmaps4Rails.map.getBounds().
2. Use resulting ta and la values to see if the marker is within those values.
3. If marker is outside of those values, center map, otherwise place marker without centering map.
Thanks guys. I should post more questions. It really helps me to think through my problems.
Jim's answer was probably right when he posted it. But as of now the right way to do it would be :
var centerpoint = new google.maps.LatLng(lat_value, long_value);
Gmaps.map.map.setCenter(centerpoint);
What you expect is automatically done as long as you pass the auto_adjust setting to true. See here.
Then, you should just use the js function Gmaps4Rails.add_markers described here.