The Path Layer takes in lists of coordinate points and renders them as extruded lines with mitering.

import DeckGL, {PathLayer} from 'deck.gl';

const App = ({data, viewport}) => {

  /**
   * Data format:
   * [
   *   {
   *     path: [[-122.4, 37.7], [-122.5, 37.8], [-122.6, 37.85]],
   *     width: 1,
   *     color: [255, 0, 0]
   *   },
   *   ...
   * ]
   */
  const layer = new PathLayer({
    id: 'path-layer',
    data,
    rounded: true,
    widthScale: 100
  });

  return (<DeckGL {...viewport} layers={[layer]} />);
};

Inherits from all Base Layer properties.

• Default: 1

The path width multiplier that multiplied to all paths.

• Default: 0

The minimum path width in pixels.

• Default: Number.MAX_SAFE_INTEGER

The maximum path width in pixels.

• Default: false

Type of joint. If true, draw round joints. Otherwise draw miter joints.

• Default: 4

The maximum extent of a joint in ratio to the stroke width. Only works if rounded is false.

• Default: false

Whether the layer should be rendered in high-precision 64-bit mode

• Default: false

Only effective if getDashArray is specified. If true, adjust gaps for the dashes to align at both ends.

• Default: (object, index) => object.paths

Returns the specified path for the object.

A path is an array of coordinates.

Returns an array of color

• Default (object, index) => object.color || [0, 0, 0, 255]

Method called to determine the rgba color of the source.

If the color alpha (the fourth component) is not provided, alpha will be set to 255.

• Default: (object, index) => object.width || 1

Method called to determine the width to draw each path with. Unit is meters.

• Default: null

Method called to get the dash array to draw each path with. Returns an array of two numbers: [dashSize, gapSize] relative to the width of the path. Returns [0, 0] to draw the path in solid line.

If this accessor is not specified, all paths are drawn as solid lines.

src/core-layers/path-layer