I am trying to overlay an image in bing map and then mask certain parts of the image.I tried the below link and I could overlay the image. However my next step is to mask.I want the image of a particular region and not a entire rectangular image.
http://blogs.bing.com/maps/2013/05/22/image-overlays-with-bing-maps-javascript/
Any inputs on this? Does Bing Map have coordinate based masking.
Thanks!
Related
I used gdal2tiles.py to split a large image into 256x256 tiles.
I then used leaflet to visualize this large image. This image is georeferenced and appears rotated on the screen. Everything is fine.
I'd like to process the 256x256 tiles of my image before there are displayed.
It is possible to watch load event to have opportunity to process tile but the tiles we get in load event are not in my image space. There are vertically aligned tiles in map, and my image is rotated.
Is there a plugin to handle this case ?
There is one to get coordinates in image space from a point clicked on map, but knowing which image tiles are hitting a map tile requires more than an inverse transform.
How can I solve that I put an image on a certain coordinate and send message to console if the image touch any building?
Interesting question. I think you can achieve this as follows:
Use a Marker to add the image to a location (see https://docs.mapbox.com/mapbox-gl-js/example/custom-marker-icons/ )
Given the HTML element for the marker, el, use getBoundingClientRect() to find the pixel positions of it, relative to the viewport.
Do some maths to find those positions relative to the map.
Call map.queryRenderedFeatures() with those positions, to detect if there is any building within the area of the marker image.
at present our project is using the leaflet, I take the map parameters to background program (map.getZoom() and map.getbounds()) , then load the returned picture(return from background program) by imageoverlay.
excuse me how to solve continuous drag or continuous scaling, only the implementation of calling a daemon?
If you mean you dynamically load the base map (i.e. the image that is zoomable, draggable and that fills a big pane, not just a small portion that would have needed a single image overlay), you should probably rather do it through a Canvas Tile Layer:
Used to create Canvas-based tile layers where tiles get drawn on the browser side.
With this, you set up a myCanvasTileLayer.drawTile function that is called by Leaflet anytime the map needs more tiles (due to user panning / zooming). Please refer to Leaflet doc for the function arguments.
If you want to stick with your image overlay technique, you might want to listen to drag and zoomend map events to re-trigger your function that loads a new image overlay.
Here's a mapbox example of using Leaflet image overlay: https://www.mapbox.com/mapbox.js/example/v1.0.0/imageoverlay-georeferenced/
Say I got a custom map, and I want to overlay an image on it. How would I go about getting the bounds for the location I want to put it in. How would I maintain the aspect ratio of the image?
I am struck with issue .
I want to use My personal Image as an image on whirly globe.I used a Jpeg file and changed into .tiff file and added to Tile Mills as a Layer (Following the rules specified in the crash course of tile mills).Now i am facing an issue while exporting the image as MbTiles .
I looked into this Link for taking reference on what should be 'Dimensions' of the image to be used on whirly globe.
Right now i have an image whose dimensions are 10184X7638. But this image is not able to wrap the complete Whirly Globe.
Please guide me on
what the dimensions should be there of the image to be used for whirly globe.
can i use this values while creating a frame for the image as the image gets strected when is added to the globe .Image1
.
This is the Image i am talking about it has a dimensions of 10184 X 7638 pixels and when i select these bounds as specified Image1 (-180,-85.11,180,85).then i get this Image2
. Here you can see the image is not able to cover the complete bounds and hence the globe also is not fully wrapped with this image.
Thanks!!
The image is less about dimensions and more about mapping it to geographic coordinates so that it can completely cover the globe. You need to make sure the image takes up your whole TileMill map if you want it to completely cover the globe in WhirlyGlobe.