mapbox 样式

mapbox 样式

  • styles
    • 1. 矢量瓦片加载(VectorSource)
    • 2. 栅格瓦片加载(RasterSource)
    • 3. 改变地图语种(Language)
    • 4. 隐藏显示图层(Visibility)
    • 5. 地图上加载图片(ImageSource)
    • 6. 时间推移效果

styles

Source子类 Source描述 Layer子类 Layer描述
GeoJsonSource 常用,存放点线面数据的json SymbolLayer 标志图层,结合点数据使用
VectorSource 常用,存放矢量瓦片的数据
(例如路况拥堵效果)
LineLayer 线图层,结合线数据使用
RasterSource 常用,存放栅格瓦片的数据 FillLayer 面图层,结合面数据使用
ImageSource 不常用,将一张图片贴在地图某片四边形区域 CircleLayer 圆图层,结合点数据使用,点为圆心,可以设置半径
RasterDemSource 不常用,带山坡效果的栅格瓦片数据 RasterLayer 栅格图层,结合栅格瓦片数据使用
CustomGeometrySource 不用 HeatmapLayer 热力图层,结合大量点数据使用效果好
UnknownSource 不用 HillshadeLayer 山坡图层,结合山坡瓦片数据使用
BackgroundLayer 背景图层,不需要结合Source即可使用
FillExtrusionLayer 面图层,带3D效果,像建筑物凸起这种
LocationIndicatorLayer 结合定位点使用的图层
CustomLayer 没有实际效果

1. 矢量瓦片加载(VectorSource)

VectorSourceActivity

          style.addSource(
            new VectorSource("terrain-data", "mapbox://mapbox.mapbox-terrain-v2")
          );

          LineLayer terrainData = new LineLayer("terrain-data", "terrain-data");
          terrainData.setSourceLayer("contour");
          terrainData.setProperties(
            lineJoin(Property.LINE_JOIN_ROUND),
            lineCap(Property.LINE_CAP_ROUND),
            lineColor(Color.parseColor("#ff69b4")),
            lineWidth(1.9f)
          );

          style.addLayer(terrainData);

2. 栅格瓦片加载(RasterSource)

AddWmsSourceActivity|AdjustLayerOpacityActivity

          style.addSource(new RasterSource(
            "web-map-source",
            new TileSet("tileset", "https://img.nj.gov/imagerywms/Natural2015?bbox={"
              + "bbox-epsg-3857}&format=image/png&service=WMS&version=1.1.1&request=GetMap&srs=EPSG:"
              + "3857&transparent=true&width=256&height=256&layers=Natural2015"), 256));

          // Create a RasterLayer with the source created above and then add the layer to the map
          if (style.getLayer("tunnel-street-minor-low") != null) {
            style.addLayerBelow(
              new RasterLayer("web-map-layer", "web-map-source"), "tunnel-street-minor-low");
          } else {
            style.addLayer(new RasterLayer("web-map-layer", "web-map-source"));
          }

3. 改变地图语种(Language)

LanguageSwitchActivity

  SymbolLayer countryLabelTextSymbolLayer = style.getLayerAs("country-label");
  countryLabelTextSymbolLayer.setProperties(textField("{name_zh-Hans}"));

4. 隐藏显示图层(Visibility)

ShowHideLayersActivity

  if (VISIBLE.equals(layer.getVisibility().getValue())) {
    layer.setProperties(visibility(NONE));
  } else {
    layer.setProperties(visibility(VISIBLE));
  }

5. 地图上加载图片(ImageSource)

ImageSourceActivity

  // Set the latitude and longitude values for the image's four corners
  LatLngQuad quad = new LatLngQuad(
    new LatLng(25.7836, -80.11725),
    new LatLng(25.783548, -80.1397431334),
    new LatLng(25.7680, -80.13964),
    new LatLng(25.76795, -80.11725)
  );

  // Add an ImageSource to the map
  style.addSource(new ImageSource(ID_IMAGE_SOURCE, quad, R.drawable.miami_beach));

  // Create a raster layer and use the imageSource's ID as the layer's data. Then add a RasterLayer to the map.
  style.addLayer(new RasterLayer(ID_IMAGE_LAYER, ID_IMAGE_SOURCE));

6. 时间推移效果

ImageSourceTimeLapseActivity

你可能感兴趣的:(mapbox地图,android)