Problem with KML GroundOverlay -- no texture drawn

CesiumJS
1

I'm just getting started with Cesium to see if the KML support will work for our project. I immediately ran into a problem when loading a kml file which contains a ground overlay; there appears to be a rectangle drawn in the correct position, but it is not rendering the tif image on the rectangle.

The tif image file is on the file system in the same directory as the KML file, and I've also tried putting a more complete path to the tif file with no improvement.

I also get this javascript error:
Resource interpreted as Image but transferred with MIME type image/tiff

I will attach the tif if I can.

Here is the kml:

<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://earth.google.com/kml/2.2" xmlns:gx="http://www.google.com/kml/ext/2.2">
<Document>
        <name>Full_survey_5m_1_1_1.kml</name>
        <Region>
                <LatLonAltBox>
                        <north>50.89288395</north>
                        <south>50.84624269</south>
                        <east>-121.6857134</east>
                        <west>-121.7598286</west>
                        <minAltitude>0</minAltitude>
                        <maxAltitude>0</maxAltitude>
                </LatLonAltBox>
                <Lod>
                        <minLodPixels>0</minLodPixels>
                        <maxLodPixels>-1</maxLodPixels>
                </Lod>
        </Region>
        <GroundOverlay>
                <gx:altitudeMode>clampToSeaFloor</gx:altitudeMode>
                <drawOrder>20</drawOrder>
                <name>Full_survey_5m_1_1_1.tif</name>
                <Icon>
                        <href>Full_survey_5m_1_1_1.tif</href>
                </Icon>
                <LatLonBox>
                        <north>50.89288395</north>
                        <south>50.84624269</south>
                        <east>-121.6857134</east>
                        <west>-121.7598286</west>
                </LatLonBox>
        </GroundOverlay>
</Document>
</kml>

Thanks
Tamar Cohen
Intelligent Robotics Group
NASA Ames Research Center

2

Here is a link to the tif:
https://plrp.xgds.org/data/xgds_map_server/bathymetry/Full_survey_5m_1_1_1.tif

3

Thanks for the sample and file. Unfortunately, the problem is that web browsers don’t support TIFF images. If I convert the tif file to png, everything works as expected. I wasn’t even aware the TIFF files were valid images in KML. The spec doesn’t list what formats are valid legal, so it’s impossible for us to know without someone running into a problem.

There are JavaScript TIFF readers out there that we may be able to use to load TIFF images. It’s not ideal to do it in JavaScript, but it’s the only option without direct browser support. I added an item to the KML roadmap so that we take care of this in the future. In the mean time, if you can convert your data (either ahead of time or on the fly) everything should work, but I realize this isn’t ideal. If you’re feeling ambitious, it probably woudln’t be hard to add basic support yourself using something like https://github.com/seikichi/tiff.js. You would have to edit the processGroundOverlay function in KmlDataSource.js to detect urls that end in tiff or tif and then process them into canvas or data uris. Though I’m not sure how good tiff.js is and if it would work with your specific tiff files, a on-the-fly solution that relies on server-side-conversion may be easier to implement.

Sorry I don’t have better news.

4

Hi Matt,

Thanks for the prompt response -- what a simple answer! Since we
authored the kml in the first place, we can simply change the image
format to png. I will experiment with that and see if it fixes the
loading from kmz as well.

Tamar