Need help to import Jpg imagery on 3d Tile

Cesium ion
1

We have a residential community site map and we want to import the jpeg image as imagery on 3d tiles. How can we create the geocode information? any information on the proper format to provide? ideally if we could provide the Longitude Latitude of each of the 4 corners that would be best.

2

Hi Jon,

Welcome to the community!

Just so I understand your problem correctly, you want to take 3D Tiles and a single existing JPG image and drape that over the tileset? If so I have a few questions:

  • Is this a large JP2 image (like something that you would want to tile itself) or a reasonable sized jpg photo that you can just look at in the browser?
  • What client are you using? CesiumJS or one of the Cesium native enginers like Unreal/Unity?

Thanks,

Matt

3

Hi Matt, thanks for your answer! so far Cesium ion look very promising. We are mostly interested to build an webapp using CesiumJS but we see usecase for Unreal as a second priority. The jpeg images in most cases will cover about 100-300 home sites for a typical community and for masterplan communities it can go up to 3000 home sites, I was thinking of uploading them to a 3d tile using Cesium ion Restful API but for now we will do manually. so providing lat long only for the 4 corners of the image should be enough IMO if possible. I cant find any documentation on how to provide those coordinates for a jpeg.

4

Thanks for the answer. There are two options here.

  1. If your jpgs are small, you can just load them directly into CesiumJS with no additional work. See this Sandcastle example

  2. For larger jpgs, ion currently doesn’t have a way to allow the users to manually supply 4 corner points directly. However this is something we have considered adding int he future so I will be sure to add your use case to our internal issue. However, you can supply a “sidecar” file along with your jpb that specifies the coordinate system and geotransform for the data. Assuming you are working in WGS84, this would look like this:

<PAMDataset>
  <SRS dataAxisToSRSAxisMapping="2,1">GEOGCS["WGS 84",DATUM["WGS_1984",SPHEROID["WGS 84",6378137,298.257223563,AUTHORITY["EPSG","7030"]],AUTHORITY["EPSG","6326"]],PRIMEM["Greenwich",0],UNIT["degree",0.0174532925199433,AUTHORITY["EPSG","9122"]],AXIS["Latitude",NORTH],AXIS["Longitude",EAST],AUTHORITY["EPSG","4326"]]</SRS>
  <GeoTransform>
    -7.5000000000000000e+01,
    6.7283431455004202e-03,
    0.0000000000000000e+00,
    2.8000000000000000e+01,
    0.0000000000000000e+00,
    5.8333333333333336e-03
    </GeoTransform>
</PAMDataset>

So if you have a file called image.jpg, create a file called image.jpg.aux.xml with the above contents and upload both to ion at the same time. It will then be placed on the globe. You can change the GeoTransform values to change the corner points (the 0 values can be left as it as this is 2D data).

CLI tools like gdal_translate can also generate this file for you:

gdal_translate -of JPEG -a_ullr -75.0, 28.0, -67.0, 29.75  -a_srs EPSG:4326 input.jpg output.jpg

After writing this up, I definitely think it’s something we should add to ion, but I currently don’t have an ETA. I’ll leave a note to post back to this message when that happens.

5

Thanks thats super helpful!!

  1. Internally we have a small tool that allow us to position the site plan vector image (SVG file format) on top of google map. Is it possible to use the google map lat long coordinates in this sidecar file? or is there any converter that we can use ? Im not familiar with the various coordinate systems and how they work.

  2. Instead of jpeg is it possible to upload and process SVG Scalable Vector Graphics format for 3d tile renderings? we have thousands on maps in this format this would allow us to keep a nice and clean resolution as the camera move closer to the tiles. if not we will convert them to jpeg.

6

  1. Yes, the example I sent you was actually using longitude/latitude degrees, which you should be able to pull out of Google Maps. The EPSG parameter is what controls the format of the coordinates on the command line example (which maps directly to the SRS in the sidecar file).

  2. ion does not currently support SVG for 3D Tiling or imagery tiling, Support for SVG would likely be part of a longer term effort to support vector data in 3D Tiles. This way the data is not being rasterized to a single pixel size and instead you would get similar resolution independent scalability like you have in your current 2D solution. There’s currently no ETA for this effort but it is a long standing feature request and something we definitely want to tackle. I will make sure to add this thread and your use case to our internal issue on the subject to add your voice to the conversation.

Thanks!

7

for the SVG would be great if in a distance to load up the raster image but as we can closer load the vector graphic.

8

We noticed a geocode in Google map dosent exactly fit the same location on bing map. why such small difference? is there a solution to convert so it fit between both?

We partially found the issue, SVG on Bing map and a converted PNG on Bing map using the same coordinates dosent end up exactly in the same location. we are investigating why.

9

I’m a colleague of Jonb and I found the reason why the map didn’t fit perfectly. Basically, in our editor, we adjust the size and the position from a svg file. Because the svg containts a viewport bigger than the graphic, the corner cordinates was further away. So, the png, that we used, didn’t containt this border, so the dimension of the png was smaller. By properly adjusting the canvas, the map now fits perfectly on Cesium.

Thank you very much for all your others answers. It was very helpfull.