Threebox with tile suorce - javascript

I'm new to threeBox and I'm developing a mapbox-gl-js map that has a 3D buildings (fill-extrusion) layer from tiles source. I want to add a symbol/icon layer with elevation from tile source useing threeBox (like icon over special buildings etc.).
From what I have seen so far threeBox layers in Mapbox can be added only GeoJson sources, is it possible to add to threeBox layer a tiles source as one adds to MapBox layers?
Thanks.

I guess ThreeBox doesn't support vector tiles.
You may be able to hack something to work by using map.querySourceFeatures() to access all the buildings in the loaded viewport as GeoJSON, then using that. There are lots of caveats that you will discover. :)

Related

ngx-mapbox-gl Mapbox GL Popup with Feature layers and not with Markers

I am creating a Mapbox GL page using ngx-mapbox-gl. I am using GeoJson Feature layers to create clusters and individual points. My code is based from this example
https://wykks.github.io/ngx-mapbox-gl/demo/cluster
This is using Features and not Markers to display points.
I would now like to further extend that example to allow popups for individual points. I don't know exactly how to do that. The examples show adding a popup directly attached to a Marker.
Interestingly enough, the exact functionality I am looking for is located by viewing a geo json file directly from GitHub.
https://github.com/Wykks/ngx-mapbox-gl/blob/master/projects/showcase/src/app/demo/examples/earthquakes.geo.json
Popups are displayed for individual points. I'm assuming those points are in the form of a Feature layer? Does anybody know where I can get the source for that viewer or help me with adding popups to Feature layer in ngx-mapbox-gl?
Thanks, Mike

level picker in JavaScript API v3 for indoor maps

I'm doing an offline mapping of my school building. One of the buildings have 9 floors. Just started to test and put two ground Overlays that way:
layer1 = new google.maps.GroundOverlay('images/2floor.svg', layerBounds);
layer2 = new google.maps.GroundOverlay('images/1floor.svg', layerBounds);
In other words, I've placed the two layers in the same spot.
I believed that when I increase zoom in the area, the floor picker would be shown, but that doesn't happen.
I appreciate any help with this.
The V3 version of javascript GroundOverlay does not support what you want to do. Google Maps will just lay the second GroundOverlay over the first, and the first will never show.
With the upcoming demise of Google Maps Engine, and because we had a need to show different imagery at different zoom levels plus non-rectangular satellite imagery, we wrote a GroundOverlayEX javascript class for Google Maps API V3. It does everything the Google Earth version of GroundOverlay does (including image rotation, non-rectangular images, drawing order, support for switching images at different zoom levels, etc).
The class is up on GitHub at https://github.com/azmikemm/GroundOverlayEX
There is complete API documentation there too (documentation.txt). This is a recent coding effort.
If you want to see a working example of the class in action, you can visit
https://sites.google.com/site/issearthatnight/. That Google Map is showing 100s of GroundOverlays drapped over North America and at the default zoom is showing low resolution images from NASA. If you zoom in, all the GroundOverlayEX objects auto-switch to high resolution images from NASA.
The zoom-switching is completely configurable in the class, and can have as many different per-zoom-level images as you want.
If you talk about the Indoor level picker of Maps, you need a processed floor plan by google.
To do this, go to (your plan will be visible by all on GMaps) :
https://www.google.com/maps/about/partners/indoormaps/
A simple GroundOverlay is just a layer, the only possibility to do that is to create buttons for changing floor...
Thanks, I'm using Leaflet with the leaflet-indoor library (https://github.com/cbaines/leaflet-indoor) to do that.
This is an example of what I want to do: http://cbaines.net/projects/osm/leaflet-indoor/examples/
Still accepting help or advice on this subject...

Display Raster Layer using ArcGIS Javascript API

I Want to display a raster layer on to my page using ArcGIS javascript API.
Loading Feature layer is easy and pretty forward but the raster layer is giving me hard time.
Here is the the MapService: http://ags.servirlabs.net/ArcGIS/rest/services/ReferenceNode/TRMM_30DAY/MapServer/0
which is Raster layer.
Do you have any ideas on how to do this?
How you add a map service layer depends on whether or not the service is cached. Look at http://ags.servirlabs.net/ArcGIS/rest/services/ReferenceNode/TRMM_30DAY/MapServer in a browser and see the following:
Single Fused Map Cache: false
Because it's not cached, you must use ArcGISDynamicMapServiceLayer, not ArcGISTiledMapServiceLayer. If it were cached, you could use either one.
map.addLayer(new esri.layers.ArcGISDynamicMapServiceLayer(
"http://ags.servirlabs.net/ArcGIS/rest/services/ReferenceNode/TRMM_30DAY/MapServer"));
Note that if you had a service with multiple layers in it and you wanted to display only a subset of them, you would create an ArcGISDynamicMapServiceLayer and then use its setVisibleLayers method to set which layers should be visible. In this case, you don't need to worry about it, because your map has only one layer in it.
You can add raster layers to your map using the ArcGISTiledMapService layer, for example:
// assuming 'map' is a reference to your map
map.addLayer(new esri.layers.ArcGISTiledMapServiceLayer("http://ags.servirlabs.net/ArcGIS/rest/services/ReferenceNode/TRMM_30DAY/MapServer"));
There are some good examples on the ArcGIS JavaScript API site here:
https://developers.arcgis.com/en/javascript/jssamples/#tiled_layers
One thing to be aware of with tiled layers is that you can only add tiled layers to your map if they are using the same spatial reference. You can't add a layer as a tiled layer with a different spatial reference as it's cache of tiles have already been produced using it's spatial reference. You can add a layer as a Dynamic layer to re-project it.

How do draw polygons which can be used with OpenLayers?

I can draw custom shapes using polygons in Inkscape. My goal is to display these shapes on top of the map of the US at fixed positions. The map and the polygons will display on a webpage with the ability to zoom in and out and pan. I wanted to know if these polygons can be placed on such a map using OpenLayers. How? Example anywhere? I am not familiar enough with OpenLayers and would learn it more if it can meet my requirements. I need to programmatically be able to color fill each shape either server or client side. I also want to place markers on the map based on lon/lat coordinates. Does OpenLayers support all this?
This is an example of what I want to do. The area in orange was defined in Inkscape and the color orange can be a different color set programmatically. This is a simple svg file displayed on the web page.
You should be able to treat the exported SVG as a regular image overlay. Here is the OpenLayers API for image overlays and here is another SO answer with a very basic image overlay example. OpenLayers supports markers, though if you're embedding the SVG as a flat image, I'm not sure if OpenLayers will allow you to style the SVG elements out of the box...
As an aside, Polymaps is an alternative mapping library that's slightly more SVG-oriented; it's especially good for stuff like dynamically transforming SVG layers based on data, manipulating styles and classes for SVG elements, etc. Per your example, here's their example for very simply throwing an image (with defined top-right / bottom-left coordinates) on a map.

CloudMade Marker Overlays - Can The Z-Index Be Controlled?

Does the CloudMade API have the ability to control the z-order or z-index of the marker overlays (e.g.icons)?
I have used this before in Google Maps to make certain icons with more importance draw over the top of other icons with lesser importance (especially in some zoom levels where they may bunch together).
The Google Maps GMarker has the zIndexProcess option to handle this. Does anyone know if CloudMade has this facility? I have scoured the API docs and found nothing. Or does anyone here perhaps have an ad-hoc method that ensures one marker (or group of makers) will be drawn on a layer above the other?
Currently this feature is not available at CloudMade, but I'll add it to our Feature Requests list..

Categories