[ios, macos] Update and reformat documentation for runtime styling (#…

…7475)

* [ios, macos] Optimized changelog for runtime styling

Changelog entries related to style JSON now lead off with the analogous portion of the runtime styling API.

* [ios, macos] Autolink cross-class property references in docs

jazzy can autolink `Class.property` references in documentation comments.

* [ios, macos] Removed extra blank lines

* [ios, macos] Corrected typo in MGLMultiPoint docs

* [ios, macos] Rewrote shape and feature docs

Rewrote documentation about MGLShape, its subclasses, and MGLFeature to emphasize runtime styling uses over annotation uses, associate each type with real-world concepts, cross-reference related style layer classes, and cross-reference related or easily confused shape classes. Links to the GeoJSON specification have been updated to RFC 7946.

* [ios, macos] Expanded style layer docs

With this change, documentation about style layer classes is nominally based on the documentation in the style specification. However, all the existing layer types’ documentation has been overridden to explain what the layer looks like, relate the layer to a real-world concept, and cross-reference related geometry classes. This change also corrects the description of MGLBackgroundStyleLayer, which erroneously stated that the identifier must be “background”, whereas that only happens to be true by default for Studio template styles.

* [ios, macos] Wrap style layer docs

* [ios, macos] Removed unused code

* [ios, macos] Corrected symbol references in docs

* [ios, macos] Corrected typo in abstract class exception

platform/darwin/scripts/generate-style-code.js

@@ -46,6 +46,15 @@ _.forOwn(cocoaConventions, function (properties, kind) {
     })
 });
 
+String.prototype.wrap = function (cols, indent) {
+	let wrapRe = new RegExp(`(.{1,${cols - indent}})(?: +|\n|$)`, "gm");
+	return this.replace(wrapRe, "$1\n").replace(/\s+$/, "").indent(indent);
+};
+
+String.prototype.indent = function (cols) {
+	return this.replace(/^|\n/g, "$&" + " ".repeat(cols));
+};
+
 global.camelize = function (str) {
     return str.replace(/(?:^|-)(.)/g, function (_, x) {
         return x.toUpperCase();
@@ -126,7 +135,7 @@ global.testHelperMessage = function (property, layerType, isFunction) {
     }
 };
 
-global.propertyDoc = function (propertyName, property, layerType) {
+global.propertyDoc = function (propertyName, property, layerType, kind) {
     // Match references to other property names & values. 
     // Requires the format 'When `foo` is set to `bar`,'.
     let doc = property.doc.replace(/`([^`]+?)` is set to `([^`]+?)`/g, function (m, peerPropertyName, propertyValue, offset, str) {
@@ -157,11 +166,24 @@ global.propertyDoc = function (propertyName, property, layerType) {
         if (!property.units.match(/s$/)) {
             property.units += 's';
         }
-        doc += `
-
- This property is measured in ${property.units}.`;
+        doc += `\n\nThis property is measured in ${property.units}.`;
+    }
+    doc = doc.replace(/(p)ixel/gi, '$1oint').replace(/(\d)px\b/g, '$1pt');
+    if (kind !== 'enum') {
+        if ('default' in property) {
+            doc += `\n\nThe default value of this property is ${propertyDefault(property, layerType)}.`;
+            if (!property.required) {
+                doc += ' Set this property to `nil` to reset it to the default value.';
+            }
+        }
+        if ('requires' in property) {
+            doc += '\n\n' + propertyReqs(property, spec[`${kind}_${layerType}`], layerType);
+        }
+        if ('original' in property) {
+            doc += `\n\nThis attribute corresponds to the <a href="https://www.mapbox.com/mapbox-gl-style-spec/#layout-${layerType}-${property.original}"><code>${property.original}</code></a> layout property in the Mapbox Style Specification.`;
+        }
     }
-    return doc.replace(/(p)ixel/gi, '$1oint').replace(/(\d)px\b/g, '$1pt');
+    return doc;
 };
 
 global.propertyReqs = function (property, propertiesByName, type) {
@@ -365,11 +387,10 @@ const layers = Object.keys(spec.layer.type.values).map((type) => {
     }, []);
 
     return {
+        doc: spec.layer.type.values[type].doc,
         type: type,
         layoutProperties: _.sortBy(layoutProperties, ['name']),
         paintProperties: _.sortBy(paintProperties, ['name']),
-        layoutPropertiesByName: spec[`layout_${type}`],
-        paintPropertiesByName: spec[`paint_${type}`],
     };
 });
 

platform/darwin/scripts/style-spec-overrides-v8.json

@@ -1,4 +1,28 @@
 {
+  "layer": {
+    "type": {
+      "values": {
+        "fill": {
+          "doc": "An `MGLFillStyleLayer` is a style layer that renders one or more filled (and optionally stroked) polygons on the map.\n\nUse a fill style layer to configure the visual appearance of polygon or multipolygon features in vector tiles loaded by an `MGLVectorSource` object or `MGLPolygon`, `MGLPolygonFeature`, `MGLMultiPolygon`, or `MGLMultiPolygonFeature` instances in an `MGLShapeSource` object."
+        },
+        "line": {
+          "doc": "An `MGLLineStyleLayer` is a style layer that renders one or more stroked polylines on the map.\n\nUse a line style layer to configure the visual appearance of polyline or multipolyline features in vector tiles loaded by an `MGLVectorSource` object or `MGLPolyline`, `MGLPolylineFeature`, `MGLMultiPolyline`, or `MGLMultiPolylineFeature` instances in an `MGLShapeSource` object."
+        },
+        "symbol": {
+          "doc": "An `MGLSymbolStyleLayer` is a style layer that renders icon and text labels at points or along lines on the map.\n\nUse a symbol style layer to configure the visual appearance of labels for features in vector tiles loaded by an `MGLVectorSource` object or `MGLShape` or `MGLFeature` instances in an `MGLShapeSource` object."
+        },
+        "circle": {
+          "doc": "An `MGLCircleStyleLayer` is a style layer that renders one or more filled circles on the map.\n\nUse a circle style layer to configure the visual appearance of point or point collection features in vector tiles loaded by an `MGLVectorSource` object or `MGLPointAnnotation`, `MGLPointFeature`, `MGLPointCollection`, or `MGLPointCollectionFeature` instances in an `MGLShapeSource` object.\n\nA circle style layer renders circles whose radii are measured in screen units. To display circles on the map whose radii correspond to real-world distances, use many-sided regular polygons and configure their appearance using an `MGLFillStyleLayer` object."
+        },
+        "raster": {
+          "doc": "An `MGLRasterStyleLayer` is a style layer that renders raster tiles on the map.\n\nUse a raster style layer to configure the color parameters of raster tiles loaded by an `MGLRasterSource` object. For example, you could use a raster style layer to render <a href=\"https://www.mapbox.com/satellite/\">Mapbox Satellite</a> imagery, a <a href=\"https://www.mapbox.com/help/define-tileset/#raster-tilesets\">raster tile set</a> uploaded to Mapbox Studio, or a raster map authored in <a href=\"https://tilemill-project.github.io/tilemill/\">TileMill</a>, the classic Mapbox Editor, or Mapbox Studio Classic."
+        },
+        "background": {
+          "doc": "An `MGLBackgroundStyleLayer` is a style layer that covers the entire map. Use a background style layer to configure a color or pattern to show below all other map content. If the style’s other layers use the Mapbox Streets source, the background style layer is responsible for drawing land, whereas the oceans and other bodies of water are drawn by `MGLFillStyleLayer` objects.\n\nA background style layer is typically the bottommost layer in a style, because it covers the entire map and can occlude any layers below it. You can therefore access it by getting the last item in the `MGLStyle.layers` array.\n\nIf the background style layer is transparent or omitted from the style, any portion of the map view that does not show another style layer is transparent."
+        }
+      }
+    }
+  },
   "layout_symbol": {
     "icon-text-fit-padding": {
       "doc": "Size of the additional area added to dimensions determined by `icon-text-fit`."

platform/darwin/src/MGLAttributionInfo.h

@@ -49,7 +49,7 @@ NS_ASSUME_NONNULL_BEGIN
  coordinate and zoom level.
  
  @param centerCoordinate The map’s center coordinate.
- @param zoomLevel The map’s zoom level. See `MGLMapView`’s `zoomLevel` property
+ @param zoomLevel The map’s zoom level. See the `MGLMapView.zoomLevel` property
     for more information.
  @return A modified URL containing a fragment that points to the specified
     viewport. If the `feedbackLink` property is set to `NO`, this method returns

platform/darwin/src/MGLBackgroundStyleLayer.h

@@ -7,10 +7,18 @@
 NS_ASSUME_NONNULL_BEGIN
 
 /**
- A map style's background layer is the bottommost layer and is used to style a color 
- or pattern to show below all other map features. You can query an `MGLMapView` for its 
- `style` and obtain the background layer using the `-[MGLStyle layerWithIdentifier:]` 
- method and passing `background` for the identifier. 
+ An `MGLBackgroundStyleLayer` is a style layer that covers the entire map. Use a
+ background style layer to configure a color or pattern to show below all other
+ map content. If the style’s other layers use the Mapbox Streets source, the
+ background style layer is responsible for drawing land, whereas the oceans and
+ other bodies of water are drawn by `MGLFillStyleLayer` objects.
+ 
+ A background style layer is typically the bottommost layer in a style, because
+ it covers the entire map and can occlude any layers below it. You can therefore
+ access it by getting the last item in the `MGLStyle.layers` array.
+ 
+ If the background style layer is transparent or omitted from the style, any
+ portion of the map view that does not show another style layer is transparent.
  */
 @interface MGLBackgroundStyleLayer : MGLStyleLayer
 
@@ -22,31 +30,41 @@ NS_ASSUME_NONNULL_BEGIN
 /**
  The color with which the background will be drawn.
  
- The default value of this property is an `MGLStyleValue` object containing `UIColor.blackColor`. Set this property to `nil` to reset it to the default value.
-
- This property is only applied to the style if `backgroundPattern` is set to `nil`. Otherwise, it is ignored.
+ The default value of this property is an `MGLStyleValue` object containing
+ `UIColor.blackColor`. Set this property to `nil` to reset it to the default
+ value.
+ 
+ This property is only applied to the style if `backgroundPattern` is set to
+ `nil`. Otherwise, it is ignored.
  */
 @property (nonatomic, null_resettable) MGLStyleValue<MGLColor *> *backgroundColor;
 #else
 /**
  The color with which the background will be drawn.
  
- The default value of this property is an `MGLStyleValue` object containing `NSColor.blackColor`. Set this property to `nil` to reset it to the default value.
-
- This property is only applied to the style if `backgroundPattern` is set to `nil`. Otherwise, it is ignored.
+ The default value of this property is an `MGLStyleValue` object containing
+ `NSColor.blackColor`. Set this property to `nil` to reset it to the default
+ value.
+ 
+ This property is only applied to the style if `backgroundPattern` is set to
+ `nil`. Otherwise, it is ignored.
  */
 @property (nonatomic, null_resettable) MGLStyleValue<MGLColor *> *backgroundColor;
 #endif
 
 /**
  The opacity at which the background will be drawn.
  
- The default value of this property is an `MGLStyleValue` object containing an `NSNumber` object containing the float `1`. Set this property to `nil` to reset it to the default value.
+ The default value of this property is an `MGLStyleValue` object containing an
+ `NSNumber` object containing the float `1`. Set this property to `nil` to reset
+ it to the default value.
  */
 @property (nonatomic, null_resettable) MGLStyleValue<NSNumber *> *backgroundOpacity;
 
 /**
- Name of image in style images to use for drawing an image background. For seamless patterns, image width and height must be a factor of two (2, 4, 8, ..., 512).
+ Name of image in style images to use for drawing an image background. For
+ seamless patterns, image width and height must be a factor of two (2, 4, 8,
+ ..., 512).
  */
 @property (nonatomic, null_resettable) MGLStyleValue<NSString *> *backgroundPattern;
 

platform/darwin/src/MGLCircleStyleLayer.h

@@ -9,7 +9,8 @@ NS_ASSUME_NONNULL_BEGIN
 /**
  Controls the scaling behavior of the circle when the map is pitched.
  
- Values of this type are used in the `circlePitchScale` property of `MGLCircleStyleLayer`.
+ Values of this type are used in the `MGLCircleStyleLayer.circlePitchScale`
+ property.
  */
 typedef NS_ENUM(NSUInteger, MGLCirclePitchScale) {
     /**
@@ -25,7 +26,8 @@ typedef NS_ENUM(NSUInteger, MGLCirclePitchScale) {
 /**
  Controls the translation reference point.
  
- Values of this type are used in the `circleTranslateAnchor` property of `MGLCircleStyleLayer`.
+ Values of this type are used in the `MGLCircleStyleLayer.circleTranslateAnchor`
+ property.
  */
 typedef NS_ENUM(NSUInteger, MGLCircleTranslateAnchor) {
     /**
@@ -39,76 +41,109 @@ typedef NS_ENUM(NSUInteger, MGLCircleTranslateAnchor) {
 };
 
 /**
- A circle layer which allows customization of styling properties at runtime. You may 
- instantiate a new circle layer to add to a map style or you may query an 
- `MGLMapView` for its `style` and obtain existing layers using the 
- `-[MGLStyle layerWithIdentifier:]` method. 
+ An `MGLCircleStyleLayer` is a style layer that renders one or more filled
+ circles on the map.
+ 
+ Use a circle style layer to configure the visual appearance of point or point
+ collection features in vector tiles loaded by an `MGLVectorSource` object or
+ `MGLPointAnnotation`, `MGLPointFeature`, `MGLPointCollection`, or
+ `MGLPointCollectionFeature` instances in an `MGLShapeSource` object.
+ 
+ A circle style layer renders circles whose radii are measured in screen units.
+ To display circles on the map whose radii correspond to real-world distances,
+ use many-sided regular polygons and configure their appearance using an
+ `MGLFillStyleLayer` object.
+ 
+ You can access an existing circle style layer using the
+ `-[MGLStyle layerWithIdentifier:]` method if you know its identifier;
+ otherwise, find it using the `MGLStyle.layers` property. You can also create a
+ new circle style layer and add it to the style using a method such as
+ `-[MGLStyle addLayer:]`.
  */
 @interface MGLCircleStyleLayer : MGLVectorStyleLayer
 
 #pragma mark - Accessing the Paint Attributes
 
 /**
- Amount to blur the circle. 1 blurs the circle such that only the centerpoint is full opacity.
+ Amount to blur the circle. 1 blurs the circle such that only the centerpoint is
+ full opacity.
  
- The default value of this property is an `MGLStyleValue` object containing an `NSNumber` object containing the float `0`. Set this property to `nil` to reset it to the default value.
+ The default value of this property is an `MGLStyleValue` object containing an
+ `NSNumber` object containing the float `0`. Set this property to `nil` to reset
+ it to the default value.
  */
 @property (nonatomic, null_resettable) MGLStyleValue<NSNumber *> *circleBlur;
 
 #if TARGET_OS_IPHONE
 /**
  The fill color of the circle.
  
- The default value of this property is an `MGLStyleValue` object containing `UIColor.blackColor`. Set this property to `nil` to reset it to the default value.
+ The default value of this property is an `MGLStyleValue` object containing
+ `UIColor.blackColor`. Set this property to `nil` to reset it to the default
+ value.
  */
 @property (nonatomic, null_resettable) MGLStyleValue<MGLColor *> *circleColor;
 #else
 /**
  The fill color of the circle.
  
- The default value of this property is an `MGLStyleValue` object containing `NSColor.blackColor`. Set this property to `nil` to reset it to the default value.
+ The default value of this property is an `MGLStyleValue` object containing
+ `NSColor.blackColor`. Set this property to `nil` to reset it to the default
+ value.
  */
 @property (nonatomic, null_resettable) MGLStyleValue<MGLColor *> *circleColor;
 #endif
 
 /**
  The opacity at which the circle will be drawn.
  
- The default value of this property is an `MGLStyleValue` object containing an `NSNumber` object containing the float `1`. Set this property to `nil` to reset it to the default value.
+ The default value of this property is an `MGLStyleValue` object containing an
+ `NSNumber` object containing the float `1`. Set this property to `nil` to reset
+ it to the default value.
  */
 @property (nonatomic, null_resettable) MGLStyleValue<NSNumber *> *circleOpacity;
 
 /**
  Controls the scaling behavior of the circle when the map is pitched.
  
- The default value of this property is an `MGLStyleValue` object containing an `NSValue` object containing `MGLCirclePitchScaleMap`. Set this property to `nil` to reset it to the default value.
+ The default value of this property is an `MGLStyleValue` object containing an
+ `NSValue` object containing `MGLCirclePitchScaleMap`. Set this property to
+ `nil` to reset it to the default value.
  */
 @property (nonatomic, null_resettable) MGLStyleValue<NSValue *> *circlePitchScale;
 
 /**
  Circle radius.
-
+ 
  This property is measured in points.
  
- The default value of this property is an `MGLStyleValue` object containing an `NSNumber` object containing the float `5`. Set this property to `nil` to reset it to the default value.
+ The default value of this property is an `MGLStyleValue` object containing an
+ `NSNumber` object containing the float `5`. Set this property to `nil` to reset
+ it to the default value.
  */
 @property (nonatomic, null_resettable) MGLStyleValue<NSNumber *> *circleRadius;
 
 /**
  The geometry's offset.
-
+ 
  This property is measured in points.
  
- The default value of this property is an `MGLStyleValue` object containing an `NSValue` object containing a `CGVector` struct set to 0 points from the left and 0 points from the top. Set this property to `nil` to reset it to the default value.
+ The default value of this property is an `MGLStyleValue` object containing an
+ `NSValue` object containing a `CGVector` struct set to 0 points from the left
+ and 0 points from the top. Set this property to `nil` to reset it to the
+ default value.
  */
 @property (nonatomic, null_resettable) MGLStyleValue<NSValue *> *circleTranslate;
 
 /**
  Controls the translation reference point.
  
- The default value of this property is an `MGLStyleValue` object containing an `NSValue` object containing `MGLCircleTranslateAnchorMap`. Set this property to `nil` to reset it to the default value.
-
- This property is only applied to the style if `circleTranslate` is non-`nil`. Otherwise, it is ignored.
+ The default value of this property is an `MGLStyleValue` object containing an
+ `NSValue` object containing `MGLCircleTranslateAnchorMap`. Set this property to
+ `nil` to reset it to the default value.
+ 
+ This property is only applied to the style if `circleTranslate` is non-`nil`.
+ Otherwise, it is ignored.
  */
 @property (nonatomic, null_resettable) MGLStyleValue<NSValue *> *circleTranslateAnchor;