Qingran-Gen/chenhai-ui/public/lib/mars3d_old/thirdParty/pbf-ol/style/MapboxStreetsV6.js

//官方mapbox-streets-v6 vector样式
// Styles for the mapbox-streets-v6 vector tile data set. Loosely based on
// http://a.tiles.mapbox.com/v4/mapbox.mapbox-streets-v6.json

(function (window) {
  class MapboxStreetsV6 {
    constructor(options = {}) {
      this._type = "mapbox-streets-v6";
    }

    getStyle(options, urltemplate) {
      var fill = new ol.style.Fill({ color: "" });
      var stroke = new ol.style.Stroke({ color: "", width: 1 });
      var polygon = new ol.style.Style({ fill: fill });
      var strokedPolygon = new ol.style.Style({ fill: fill, stroke: stroke });
      var line = new ol.style.Style({ stroke: stroke });
      var text = new ol.style.Style({
        text: new ol.style.Text({
          text: "",
          fill: fill,
          stroke: stroke,
        }),
      });
      var iconCache = {};
      function getIcon(iconName) {
        var icon = iconCache[iconName];
        if (!icon) {
          icon = new ol.style.Style({
            image: new ol.style.Icon({
              src: "https://unpkg.com/@mapbox/maki@4.0.0/icons/" + iconName + "-15.svg",
              imgSize: [15, 15],
            }),
          });
          iconCache[iconName] = icon;
        }
        return icon;
      }

      var styles = [];
      return function (feature, resolution) {
        var length = 0;
        var layer = feature.get("layer");
        var cls = feature.get("class");
        var type = feature.get("type");
        var scalerank = feature.get("scalerank");
        var labelrank = feature.get("labelrank");
        var adminLevel = feature.get("admin_level");
        var maritime = feature.get("maritime");
        var disputed = feature.get("disputed");
        var maki = feature.get("maki");
        var geom = feature.getGeometry().getType();
        if (layer == "landuse" && cls == "park") {
          fill.setColor("#d8e8c8");
          styles[length++] = polygon;
        } else if (layer == "landuse" && cls == "cemetery") {
          fill.setColor("#e0e4dd");
          styles[length++] = polygon;
        } else if (layer == "landuse" && cls == "hospital") {
          fill.setColor("#fde");
          styles[length++] = polygon;
        } else if (layer == "landuse" && cls == "school") {
          fill.setColor("#f0e8f8");
          styles[length++] = polygon;
        } else if (layer == "landuse" && cls == "wood") {
          fill.setColor("rgb(233,238,223)");
          styles[length++] = polygon;
        } else if (layer == "waterway" && cls != "river" && cls != "stream" && cls != "canal") {
          stroke.setColor("#a0c8f0");
          stroke.setWidth(1);
          styles[length++] = line;
        } else if (layer == "waterway" && cls == "river") {
          stroke.setColor("#a0c8f0");
          stroke.setWidth(1);
          styles[length++] = line;
        } else if (layer == "waterway" && (cls == "stream" || cls == "canal")) {
          stroke.setColor("#a0c8f0");
          stroke.setWidth(1);
          styles[length++] = line;
        } else if (layer == "water") {
          fill.setColor("#a0c8f0");
          styles[length++] = polygon;
        } else if (layer == "aeroway" && geom == "Polygon") {
          fill.setColor("rgb(242,239,235)");
          styles[length++] = polygon;
        } else if (layer == "aeroway" && geom == "LineString" && resolution <= 76.43702828517625) {
          stroke.setColor("#f0ede9");
          stroke.setWidth(1);
          styles[length++] = line;
        } else if (layer == "building") {
          fill.setColor("#f2eae2");
          stroke.setColor("#dfdbd7");
          stroke.setWidth(1);
          styles[length++] = strokedPolygon;
        } else if (layer == "tunnel" && cls == "motorway_link") {
          stroke.setColor("#e9ac77");
          stroke.setWidth(1);
          styles[length++] = line;
        } else if (layer == "tunnel" && cls == "service") {
          stroke.setColor("#cfcdca");
          stroke.setWidth(1);
          styles[length++] = line;
        } else if (layer == "tunnel" && (cls == "street" || cls == "street_limited")) {
          stroke.setColor("#cfcdca");
          stroke.setWidth(1);
          styles[length++] = line;
        } else if (layer == "tunnel" && cls == "main" && resolution <= 1222.99245256282) {
          stroke.setColor("#e9ac77");
          stroke.setWidth(1);
          styles[length++] = line;
        } else if (layer == "tunnel" && cls == "motorway") {
          stroke.setColor("#e9ac77");
          stroke.setWidth(1);
          styles[length++] = line;
        } else if (layer == "tunnel" && cls == "path") {
          stroke.setColor("#cba");
          stroke.setWidth(1);
          styles[length++] = line;
        } else if (layer == "tunnel" && cls == "major_rail") {
          stroke.setColor("#bbb");
          stroke.setWidth(2);
          styles[length++] = line;
        } else if (layer == "road" && cls == "motorway_link") {
          stroke.setColor("#e9ac77");
          stroke.setWidth(1);
          styles[length++] = line;
        } else if (layer == "road" && (cls == "street" || cls == "street_limited") && geom == "LineString") {
          stroke.setColor("#cfcdca");
          stroke.setWidth(1);
          styles[length++] = line;
        } else if (layer == "road" && cls == "main" && resolution <= 1222.99245256282) {
          stroke.setColor("#e9ac77");
          stroke.setWidth(1);
          styles[length++] = line;
        } else if (layer == "road" && cls == "motorway" && resolution <= 4891.96981025128) {
          stroke.setColor("#e9ac77");
          stroke.setWidth(1);
          styles[length++] = line;
        } else if (layer == "road" && cls == "path") {
          stroke.setColor("#cba");
          stroke.setWidth(1);
          styles[length++] = line;
        } else if (layer == "road" && cls == "major_rail") {
          stroke.setColor("#bbb");
          stroke.setWidth(2);
          styles[length++] = line;
        } else if (layer == "bridge" && cls == "motorway_link") {
          stroke.setColor("#e9ac77");
          stroke.setWidth(1);
          styles[length++] = line;
        } else if (layer == "bridge" && cls == "motorway") {
          stroke.setColor("#e9ac77");
          stroke.setWidth(1);
          styles[length++] = line;
        } else if (layer == "bridge" && cls == "service") {
          stroke.setColor("#cfcdca");
          stroke.setWidth(1);
          styles[length++] = line;
        } else if (layer == "bridge" && (cls == "street" || cls == "street_limited")) {
          stroke.setColor("#cfcdca");
          stroke.setWidth(1);
          styles[length++] = line;
        } else if (layer == "bridge" && cls == "main" && resolution <= 1222.99245256282) {
          stroke.setColor("#e9ac77");
          stroke.setWidth(1);
          styles[length++] = line;
        } else if (layer == "bridge" && cls == "path") {
          stroke.setColor("#cba");
          stroke.setWidth(1);
          styles[length++] = line;
        } else if (layer == "bridge" && cls == "major_rail") {
          stroke.setColor("#bbb");
          stroke.setWidth(2);
          styles[length++] = line;
        } else if (layer == "admin" && adminLevel >= 3 && maritime === 0) {
          stroke.setColor("#9e9cab");
          stroke.setWidth(1);
          styles[length++] = line;
        } else if (layer == "admin" && adminLevel == 2 && disputed === 0 && maritime === 0) {
          stroke.setColor("#9e9cab");
          stroke.setWidth(1);
          styles[length++] = line;
        } else if (layer == "admin" && adminLevel == 2 && disputed === 1 && maritime === 0) {
          stroke.setColor("#9e9cab");
          stroke.setWidth(1);
          styles[length++] = line;
        } else if (layer == "admin" && adminLevel >= 3 && maritime === 1) {
          stroke.setColor("#a0c8f0");
          stroke.setWidth(1);
          styles[length++] = line;
        } else if (layer == "admin" && adminLevel == 2 && maritime === 1) {
          stroke.setColor("#a0c8f0");
          stroke.setWidth(1);
          styles[length++] = line;
        } else if (layer == "country_label" && scalerank === 1) {
          text.getText().setText(feature.get("name_en"));
          text.getText().setFont('bold 11px "Open Sans", "Arial Unicode MS"');
          fill.setColor("#334");
          stroke.setColor("rgba(255,255,255,0.8)");
          stroke.setWidth(2);
          styles[length++] = text;
        } else if (layer == "country_label" && scalerank === 2 && resolution <= 19567.87924100512) {
          text.getText().setText(feature.get("name_en"));
          text.getText().setFont('bold 10px "Open Sans", "Arial Unicode MS"');
          fill.setColor("#334");
          stroke.setColor("rgba(255,255,255,0.8)");
          stroke.setWidth(2);
          styles[length++] = text;
        } else if (layer == "country_label" && scalerank === 3 && resolution <= 9783.93962050256) {
          text.getText().setText(feature.get("name_en"));
          text.getText().setFont('bold 9px "Open Sans", "Arial Unicode MS"');
          fill.setColor("#334");
          stroke.setColor("rgba(255,255,255,0.8)");
          stroke.setWidth(2);
          styles[length++] = text;
        } else if (layer == "country_label" && scalerank === 4 && resolution <= 4891.96981025128) {
          text.getText().setText(feature.get("name_en"));
          text.getText().setFont('bold 8px "Open Sans", "Arial Unicode MS"');
          fill.setColor("#334");
          stroke.setColor("rgba(255,255,255,0.8)");
          stroke.setWidth(2);
          styles[length++] = text;
        } else if (layer == "marine_label" && labelrank === 1 && geom == "Point") {
          text.getText().setText(feature.get("name_en"));
          text.getText().setFont('italic 11px "Open Sans", "Arial Unicode MS"');
          fill.setColor("#74aee9");
          stroke.setColor("rgba(255,255,255,0.8)");
          stroke.setWidth(1);
          styles[length++] = text;
        } else if (layer == "marine_label" && labelrank === 2 && geom == "Point") {
          text.getText().setText(feature.get("name_en"));
          text.getText().setFont('italic 11px "Open Sans", "Arial Unicode MS"');
          fill.setColor("#74aee9");
          stroke.setColor("rgba(255,255,255,0.8)");
          stroke.setWidth(1);
          styles[length++] = text;
        } else if (layer == "marine_label" && labelrank === 3 && geom == "Point") {
          text.getText().setText(feature.get("name_en"));
          text.getText().setFont('italic 10px "Open Sans", "Arial Unicode MS"');
          fill.setColor("#74aee9");
          stroke.setColor("rgba(255,255,255,0.8)");
          stroke.setWidth(1);
          styles[length++] = text;
        } else if (layer == "marine_label" && labelrank === 4 && geom == "Point") {
          text.getText().setText(feature.get("name_en"));
          text.getText().setFont('italic 9px "Open Sans", "Arial Unicode MS"');
          fill.setColor("#74aee9");
          stroke.setColor("rgba(255,255,255,0.8)");
          stroke.setWidth(1);
          styles[length++] = text;
        } else if (layer == "place_label" && type == "city" && resolution <= 1222.99245256282) {
          text.getText().setText(feature.get("name_en"));
          text.getText().setFont('11px "Open Sans", "Arial Unicode MS"');
          fill.setColor("#333");
          stroke.setColor("rgba(255,255,255,0.8)");
          stroke.setWidth(1);
          styles[length++] = text;
        } else if (layer == "place_label" && type == "town" && resolution <= 305.748113140705) {
          text.getText().setText(feature.get("name_en"));
          text.getText().setFont('9px "Open Sans", "Arial Unicode MS"');
          fill.setColor("#333");
          stroke.setColor("rgba(255,255,255,0.8)");
          stroke.setWidth(1);
          styles[length++] = text;
        } else if (layer == "place_label" && type == "village" && resolution <= 38.21851414258813) {
          text.getText().setText(feature.get("name_en"));
          text.getText().setFont('8px "Open Sans", "Arial Unicode MS"');
          fill.setColor("#333");
          stroke.setColor("rgba(255,255,255,0.8)");
          stroke.setWidth(1);
          styles[length++] = text;
        } else if (layer == "place_label" && resolution <= 19.109257071294063 && (type == "hamlet" || type == "suburb" || type == "neighbourhood")) {
          text.getText().setText(feature.get("name_en"));
          text.getText().setFont('bold 9px "Arial Narrow"');
          fill.setColor("#633");
          stroke.setColor("rgba(255,255,255,0.8)");
          stroke.setWidth(1);
          styles[length++] = text;
        } else if (layer == "poi_label" && resolution <= 19.109257071294063 && scalerank == 1 && maki !== "marker") {
          styles[length++] = getIcon(maki);
        } else if (layer == "poi_label" && resolution <= 9.554628535647032 && scalerank == 2 && maki !== "marker") {
          styles[length++] = getIcon(maki);
        } else if (layer == "poi_label" && resolution <= 4.777314267823516 && scalerank == 3 && maki !== "marker") {
          styles[length++] = getIcon(maki);
        } else if (layer == "poi_label" && resolution <= 2.388657133911758 && scalerank == 4 && maki !== "marker") {
          styles[length++] = getIcon(maki);
        } else if (layer == "poi_label" && resolution <= 1.194328566955879 && scalerank >= 5 && maki !== "marker") {
          styles[length++] = getIcon(maki);
        }
        styles.length = length;
        return styles;
      };
    }
  }
  //对外接口
  window.mars3d.MapboxStreetsV6 = MapboxStreetsV6;
})(window);