dashArray property

List<double> dashArray

Apply same dash pattern for all the MapLine in the lines collection.

A sequence of dash and gap will be rendered based on the values in this list. Once all values of the list is rendered, it will be repeated again till the end of the line.

late List<Model> _lines;
late MapZoomPanBehavior _zoomPanBehavior;
late MapShapeSource _mapSource;

 @override
 void initState() {
   _zoomPanBehavior = MapZoomPanBehavior(
     focalLatLng: MapLatLng(40.7128, -95.3698),
     zoomLevel: 3,
   );

   _mapSource = MapShapeSource.asset(
     "assets/world_map.json",
     shapeDataField: "continent",
   );

   _lines = <Model>[
     Model(MapLatLng(40.7128, -74.0060), MapLatLng(44.9778, -93.2650)),
     Model(MapLatLng(40.7128, -74.0060), MapLatLng(33.4484, -112.0740)),
     Model(MapLatLng(40.7128, -74.0060), MapLatLng(29.7604, -95.3698)),
     Model(MapLatLng(40.7128, -74.0060), MapLatLng(39.7392, -104.9903)),
   ];

   super.initState();
 }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SfMaps(
        layers: [
          MapShapeLayer(
            source: _mapSource,
            zoomPanBehavior: _zoomPanBehavior,
            sublayers: [
              MapLineLayer(
                dashArray: [8, 3, 4, 3],
                lines: List<MapLine>.generate(
                  _lines.length,
                  (int index) {
                    return MapLine(
                      from: _lines[index].from,
                      to: _lines[index].to,
                    );
                  },
                ).toSet(),
              ),
            ],
          ),
        ],
      ),
    );
  }

class Model {
  Model(this.from, this.to);

  MapLatLng from;
  MapLatLng to;
}

See also:

• The MapLine.dashArray, to apply dash pattern for the individual map line.

Implementation

final List<double> dashArray;