Android中的Mapbox-GEOTiff栅格图层周围为黑色 [英] Mapbox in Android - Black color around GEOTiff raster layers

查看：188
本文介绍了Android中的Mapbox-GEOTiff栅格图层周围为黑色的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我需要在地图上添加一些从FAA提取的航空图层.这些图层以GeoTIFF文件的形式提供.

I need to add some aeronautical layers taken from FAA to the map. The layers are provided as GeoTIFF files.

  1. 从 FAA 网站下载了GeoTiff文件.
    2. li>
  2. 使用 QGis 应用程序从文件中剪切图例.实际上，在没有此步骤的情况下也会发生此问题.
  3. 使用GDAL命令gdalwarp -q -t_srs EPSG:3857 -dstalpha -of vrt Albuquerque\ SEC\ 104-cut.tif /vsistdout/ | gdal_translate -co compress=lzw /vsistdin/ Albuquerque\ SEC\ 104-north-up-cut.tif将其重新投影到EPSG:3857.否则，上传到Mapbox时会显示Error creating Mapnik Datasource: Invalid raster: Invalid rotation value in geotransform array.
  4. 通过将GeoTIFF上传到地图框来创建图块集.
  5. 在 Mapbox Studio 中创建新样式.
  6. 将图块集添加为图层.
  1. Downloaded a GeoTiff file from FAA website.
  2. Using QGis app clipped the legend from the file. Actually the issue occurs without this step as well.
  3. Reprojected it to EPSG:3857 using GDAL command gdalwarp -q -t_srs EPSG:3857 -dstalpha -of vrt Albuquerque\ SEC\ 104-cut.tif /vsistdout/ | gdal_translate -co compress=lzw /vsistdin/ Albuquerque\ SEC\ 104-north-up-cut.tif. Otherwise I got Error creating Mapnik Datasource: Invalid raster: Invalid rotation value in geotransform array when uploading to Mapbox.
  4. Created a Tileset by uploading GeoTIFFs to Mapbox.
  5. Created a new style in the Mapbox Studio.
  6. Added the tilesets as layers.

Mapbox Studio结果

该地图在 Mapbox Studio 中显示良好:

但是，在Android应用程序中，此样式会根据缩放级别和相机位置显示一些带有随机宽度的黑色边框. 这是在android中的外观:

However in Android app this style shows with some black borders of random width depending on zoom level and camera position. Here is how it looks in android:

我在Pixel 3a(Android 10)，Nexus 5x(Android 8.1)和Android模拟器(Android 10)上进行了尝试.我的互联网连接良好，并给了足够的时间，以便加载磁贴.

I tried it on Pixel 3a (Android 10), Nexus 5x (Android 8.1) and Android emulator (Android 10). I have good internet connection and gave it enough time so the tiles are loaded.

嵌入地图的源代码是官方 Demo应用.我只是替换了令牌和样式URL:

The source code where the map is embedded is official Demo app. I just replaced token and style URL:

mapView.getMapAsync(new OnMapReadyCallback() {
  @Override
  public void onMapReady(@NonNull MapboxMap mapboxMap) {
    DefaultStyleActivity.this.mapboxMap = mapboxMap;
      mapboxMap.setStyle("mapbox://styles/rustamg/ck8se724l23bh1io2b1hnbqls");
  }
});

这是我上传的GEOTiff的GDALInfo:

Here is GDALInfo for the GEOTiff I uploaded:

Driver: GTiff/GeoTIFF
Files: /Users/me/Desktop/Dev/Albuquerque SEC 104-north-up-cut.tif
Size is 16104, 11408
Coordinate System is:
PROJCS["WGS 84 / Pseudo-Mercator",
    GEOGCS["WGS 84",
        DATUM["WGS_1984",
            SPHEROID["WGS 84",6378137,298.257223563,
                AUTHORITY["EPSG","7030"]],
            AUTHORITY["EPSG","6326"]],
        PRIMEM["Greenwich",0,
            AUTHORITY["EPSG","8901"]],
        UNIT["degree",0.0174532925199433,
            AUTHORITY["EPSG","9122"]],
        AUTHORITY["EPSG","4326"]],
    PROJECTION["Mercator_1SP"],
    PARAMETER["central_meridian",0],
    PARAMETER["scale_factor",1],
    PARAMETER["false_easting",0],
    PARAMETER["false_northing",0],
    UNIT["metre",1,
        AUTHORITY["EPSG","9001"]],
    AXIS["X",EAST],
    AXIS["Y",NORTH],
    EXTENSION["PROJ4","+proj=merc +a=6378137 +b=6378137 +lat_ts=0.0 +lon_0=0.0 +x_0=0.0 +y_0=0 +k=1.0 +units=m +nadgrids=@null +wktext +no_defs"],
    AUTHORITY["EPSG","3857"]]
Origin = (-12154316.342745549976826,4340308.343459489755332)
Pixel Size = (51.194510520863538,-51.194510520863538)
Metadata:
  AREA_OR_POINT=Area
  TIFFTAG_DATETIME=2019:09:03 09:02:22
  TIFFTAG_RESOLUTIONUNIT=2 (pixels/inch)
  TIFFTAG_SOFTWARE=Adobe Photoshop CC (Windows)
  TIFFTAG_XRESOLUTION=300
  TIFFTAG_YRESOLUTION=300
Image Structure Metadata:
  COMPRESSION=LZW
  INTERLEAVE=PIXEL
Corner Coordinates:
Upper Left  (-12154316.343, 4340308.343) (109d11' 2.69"W, 36d17'16.43"N)
Lower Left  (-12154316.343, 3756281.367) (109d11' 2.69"W, 31d56'47.16"N)
Upper Right (-11329879.945, 4340308.343) (101d46'40.96"W, 36d17'16.43"N)
Lower Right (-11329879.945, 3756281.367) (101d46'40.96"W, 31d56'47.16"N)
Center      (-11742098.144, 4048294.855) (105d28'51.82"W, 34d 8'42.17"N)
Band 1 Block=16104x1 Type=Byte, ColorInterp=Palette
  Mask Flags: PER_DATASET ALPHA 
  Color Table (RGB with 256 entries)
    0: 255,255,255,255
    1: 255,255,0,255
    2: 255,0,255,255
    3: 255,0,0,255
    4: 0,255,255,255
    5: 0,255,0,255
    6: 0,0,255,255
    7: 0,0,0,255
    8: 252,252,254,255
    9: 255,255,1,255
   10: 252,236,170,255
   11: 248,228,166,255
   12: 228,200,154,255
   13: 154,81,86,255
   14: 120,103,105,255
   15: 221,135,154,255
   16: 166,87,106,255
   17: 107,86,91,255
   18: 172,104,124,255
   19: 79,9,35,255
   20: 141,59,88,255
   21: 126,12,61,255
   22: 229,107,161,255
   23: 200,150,173,255
   24: 234,178,204,255
   25: 100,8,53,255
   26: 200,81,137,255
   27: 146,68,105,255
   28: 136,38,88,255
   29: 98,29,64,255
   30: 190,113,151,255
   31: 119,44,83,255
   32: 214,182,199,255
   33: 177,144,163,255
   34: 116,13,75,255
   35: 33,8,25,255
   36: 143,116,141,255
   37: 232,216,232,255
   38: 248,232,248,255
   39: 77,26,86,255
   40: 75,69,104,255
   41: 105,103,125,255
   42: 40,36,105,255
   43: 8,8,24,255
   44: 232,232,248,255
   45: 120,120,122,255
   46: 8,14,85,255
   47: 203,204,216,255
   48: 60,62,80,255
   49: 8,22,115,255
   50: 86,88,104,255
   51: 180,184,201,255
   52: 8,54,179,255
   53: 8,40,120,255
   54: 28,56,120,255
   55: 8,40,104,255
   56: 143,152,171,255
   57: 8,54,136,255
   58: 37,47,65,255
   59: 184,201,232,255
   60: 25,72,152,255
   61: 202,214,233,255
   62: 31,56,95,255
   63: 8,84,182,255
   64: 8,72,158,255
   65: 8,56,120,255
   66: 9,42,86,255
   67: 25,72,136,255
   68: 37,88,152,255
   69: 51,75,104,255
   70: 11,100,202,255
   71: 8,23,40,255
   72: 27,72,120,255
   73: 8,56,104,255
   74: 44,88,133,255
   75: 184,198,212,255
   76: 80,84,88,255
   77: 8,72,133,255
   78: 22,104,178,255
   79: 71,121,168,255
   80: 91,134,173,255
   81: 43,121,184,255
   82: 80,113,140,255
   83: 8,88,152,255
   84: 24,88,136,255
   85: 53,104,143,255
   86: 8,88,136,255
   87: 22,104,149,255
   88: 114,144,162,255
   89: 139,172,191,255
   90: 104,124,134,255
   91: 146,205,232,255
   92: 136,197,216,255
   93: 134,184,201,255
   94: 153,200,216,255
   95: 135,216,232,255
   96: 85,105,109,255
   97: 213,233,236,255
   98: 152,195,200,255
   99: 167,216,221,255
  100: 181,232,237,255
  101: 151,233,237,255
  102: 8,24,24,255
  103: 230,248,248,255
  104: 182,183,183,255
  105: 184,217,216,255
  106: 120,136,134,255
  107: 24,40,37,255
  108: 174,207,200,255
  109: 143,147,145,255
  110: 225,248,232,255
  111: 103,120,104,255
  112: 8,24,8,255
  113: 87,104,86,255
  114: 212,232,210,255
  115: 181,200,175,255
  116: 163,171,158,255
  117: 229,248,216,255
  118: 198,216,184,255
  119: 147,172,126,255
  120: 231,248,200,255
  121: 200,216,168,255
  122: 216,232,178,255
  123: 200,216,151,255
  124: 232,248,184,255
  125: 212,232,146,255
  126: 232,248,167,255
  127: 189,207,105,255
  128: 199,200,152,255
  129: 248,248,71,255
  130: 24,24,8,255
  131: 145,144,57,255
  132: 248,248,104,255
  133: 216,216,135,255
  134: 248,248,168,255
  135: 200,200,136,255
  136: 216,216,152,255
  137: 232,232,168,255
  138: 248,248,184,255
  139: 216,216,168,255
  140: 232,232,184,255
  141: 248,248,200,255
  142: 200,200,168,255
  143: 120,120,101,255
  144: 232,232,200,255
  145: 248,248,216,255
  146: 216,216,193,255
  147: 200,200,184,255
  148: 232,232,216,255
  149: 248,248,232,255
  150: 170,168,56,255
  151: 201,194,72,255
  152: 179,174,78,255
  153: 229,223,101,255
  154: 214,205,88,255
  155: 196,189,104,255
  156: 232,218,133,255
  157: 246,233,151,255
  158: 42,40,29,255
  159: 148,136,82,255
  160: 200,184,120,255
  161: 216,200,136,255
  162: 232,216,152,255
  163: 248,232,168,255
  164: 165,152,104,255
  165: 114,106,76,255
  166: 182,173,141,255
  167: 248,216,115,255
  168: 183,168,119,255
  169: 147,139,114,255
  170: 200,168,72,255
  171: 216,184,88,255
  172: 200,184,136,255
  173: 216,200,152,255
  174: 232,216,168,255
  175: 248,232,184,255
  176: 228,184,72,255
  177: 200,168,88,255
  178: 216,184,104,255
  179: 81,74,58,255
  180: 248,188,71,255
  181: 232,185,88,255
  182: 248,199,101,255
  183: 200,168,104,255
  184: 216,184,120,255
  185: 232,200,136,255
  186: 248,216,152,255
  187: 168,152,120,255
  188: 200,184,152,255
  189: 216,200,168,255
  190: 232,216,184,255
  191: 219,167,72,255
  192: 178,144,82,255
  193: 248,231,200,255
  194: 184,136,56,255
  195: 216,168,88,255
  196: 232,185,104,255
  197: 248,200,123,255
  198: 220,150,49,255
  199: 130,93,40,255
  200: 200,152,84,255
  201: 184,152,104,255
  202: 200,168,120,255
  203: 216,184,136,255
  204: 232,200,152,255
  205: 248,216,168,255
  206: 179,119,36,255
  207: 160,114,54,255
  208: 216,168,104,255
  209: 232,184,120,255
  210: 200,137,56,255
  211: 232,168,88,255
  212: 61,53,43,255
  213: 146,115,80,255
  214: 216,168,120,255
  215: 248,200,152,255
  216: 168,136,104,255
  217: 184,152,120,255
  218: 200,168,136,255
  219: 216,184,152,255
  220: 232,200,168,255
  221: 248,216,184,255
  222: 216,200,184,255
  223: 248,232,216,255
  224: 110,87,68,255
  225: 248,184,135,255
  226: 170,151,137,255
  227: 184,136,104,255
  228: 200,152,120,255
  229: 216,168,136,255
  230: 232,184,150,255
  231: 248,200,168,255
  232: 171,114,77,255
  233: 168,136,120,255
  234: 232,200,184,255
  235: 200,183,174,255
  236: 232,164,134,255
  237: 200,168,154,255
  238: 248,167,139,255
  239: 171,119,104,255
  240: 216,168,154,255
  241: 184,133,121,255
  242: 140,117,111,255
  243: 232,213,208,255
  244: 201,148,137,255
  245: 235,181,172,255
  246: 216,138,126,255
  247: 41,24,23,255
  248: 24,8,8,255
  249: 248,232,232,255
  250: 201,200,200,255
  251: 248,248,248,255
  252: 232,232,232,255
  253: 104,104,104,255
  254: 24,24,24,255
  255: 8,8,8,255
Band 2 Block=16104x1 Type=Byte, ColorInterp=Alpha

问题

我该如何消除这些黑色问题?

Question

How can I get rid of those black issues?

如果需要，我很乐意提供更多信息.

I'd be happy to provide more info if needed.

我尝试了故障排除中的建议页面:既准备图块并在Android应用中创建RasterSource.第一个命令rio calc "(asarray (take a 1) (take a 2) (take a 3))" --co compress=lzw --co tiled=true --co blockxsize=256 --co blockysize=256 --name a=filename.tif filename255.tif失败，并显示错误:

I tried what's suggested in troubleshooting page: both prepare tileset and create RasterSource within Android app. The first command rio calc "(asarray (take a 1) (take a 2) (take a 3))" --co compress=lzw --co tiled=true --co blockxsize=256 --co blockysize=256 --name a=filename.tif filename255.tif failed with an error:

IndexError:索引1超出了大小1的范围

IndexError: index 1 is out of bounds for size 1

但是我的tif已经使用LZW压缩了.所以我尝试了第二个命令:

However my tif already uses LZW compression. So I tried the second command:

rio edit-info --nodata 0 filename255.tif

，然后将结果上传到Mapbox. 除了图像的白色背景也变为黑色之外，结果是相同的:

and uploaded the result to Mapbox. The result was the same except that white background of the image became black as well:

我还尝试了使用较小的图像(409x306)指出的相同步骤此处，Android具有纹理大小限制.结果是一样的:

I also tried the same steps with smaller image (409x306) as it's pointed here that Android has texture size limitation. The result is all the same:

推荐答案

黑色边框应该是透明的，但是Mapbox使用的栅格图像格式(JPG)不支持透明性，这是每一个gl中都存在的已知问题基于本地的SDK.当您引用内置了栅格图层的样式时，就会出现此问题.

The black borders should be transparent, but the raster image format Mapbox is using (JPG) does not support transparency, which is a known issue that exists in every gl-native-based SDK. This issue presents itself when you reference a style that has the raster layer built in.

作为解决方法，您可以在对光栅图像进行故障排除中遵循Mapbox的故障排除指南.具有黑色背景以使图块集透明，然后将其作为RasterSource添加到Android应用程序中，以按预期显示栅格图块.

As a workaround, you can follow Mapbox's troubleshooting guide on troubleshooting raster images with black backgrounds to make your tileset transparent and then add the tileset as a RasterSource within your Android application to display the raster tile as expected.

请看以下示例，作为添加RasterSource的参考:

Please take a look at the following example as a reference for adding a RasterSource:

与其使用"mapbox://username.tilesetID"来调用rasterSource，还需要类似于添加WMS源"示例来调用它.下面的代码将解决您的问题:

Instead of calling the rasterSource using "mapbox://username.tilesetID", you need to call it similarly to the Add a WMS Source example. The code below will resolve your issue:

style.addSource(RasterSource( "albuquerque-source", TileSet( "tileset", "https://api.mapbox.com/v4/<username.tilesetID>/{z}/{x}/{y}.png?access_token=<your_access_token>" ), 256 ))

这篇关于Android中的Mapbox-GEOTiff栅格图层周围为黑色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文
相关文章
其他开发最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆