MapColorMapper class Null safety

Customizes the shape or bubble color based on the data source and sets the text and icon color for legend items.

MapShapeSource.shapeColorMappers and MapShapeSource.bubbleColorMappers accepts collection of MapColorMapper.

MapShapeSource.shapeColorValueMapper and MapShapeSource.bubbleColorValueMapper returns a color or value based on which shape or bubble color will be updated.

If they return a color, then this color will be applied to the shapes or bubbles straightaway.

If they return a value other than the color, then you must set the MapShapeSource.shapeColorMappers or MapShapeSource.bubbleColorMappers property.

The value returned from the MapShapeSource.shapeColorValueMapper and MapShapeSource.bubbleColorValueMapper will be used for the comparison in the MapColorMapper.value or MapColorMapper.from and MapColorMapper.to. Then, the MapColorMapper.color will be applied to the respective shape or bubble.

Legend icon's color and text will be taken from MapColorMapper.color or MapColorMapper.text respectively.

The below code snippet represents how color can be applied to the shape based on the MapColorMapper.value property of MapColorMapper.

late List<Model> _data;
late MapShapeSource _mapSource;

 @override
 void initState() {
   super.initState();

   _data = <Model>[
    Model('India', 280, "Low"),
    Model('United States of America', 190, "High"),
    Model('Pakistan', 37, "Low"),
   ];

   _mapSource = MapShapeSource.asset(
     "assets/world_map.json",
     shapeDataField: "name",
     dataCount: _data.length,
     primaryValueMapper: (int index) {
       return _data[index].country;
     },
     shapeColorValueMapper: (int index) {
        return _data[index].storage;
     },
     shapeColorMappers: [
        MapColorMapper(value: "Low", color: Colors.red),
        MapColorMapper(value: "High", color: Colors.green)
     ],
   );
 }

 @override
 Widget build(BuildContext context) {
   return SfMaps(
     layers: [
       MapShapeLayer(
         source: _mapSource,
       )
     ],
   );
 }

class Model {
 const Model(this.country, this.count, this.storage);

 final String country;
 final double count;
 final String storage;
}

The below code snippet represents how color can be applied to the shape based on the range between MapColorMapper.from and MapColorMapper.to properties of MapColorMapper.

late List<Model> _data;
late MapShapeSource _mapSource;

 @override
 void initState() {
   super.initState();

   _data = <Model>[
    Model('India', 100, "Low"),
    Model('United States of America', 200, "High"),
    Model('Pakistan', 75, "Low"),
   ];

   _mapSource = MapShapeSource.asset(
     "assets/world_map.json",
     shapeDataField: "name",
     dataCount: _data.length,
     primaryValueMapper: (int index) {
       return _data[index].country;
     },
     shapeColorValueMapper: (int index) {
        return _data[index].count;
     },
     shapeColorMappers: [
        MapColorMapper(from: 0, to:  100, color: Colors.red),
        MapColorMapper(from: 101, to: 200, color: Colors.yellow)
     ]
   );
 }

 @override
 Widget build(BuildContext context) {
   return SfMaps(
     layers: [
       MapShapeLayer(
         source: _mapSource,
       )
     ],
   );
 }

class Model {
 const Model(this.country, this.count, this.storage);

 final String country;
 final double count;
 final String storage;
}

See also:

Annotations

Constructors

MapColorMapper({double? from, double? to, String? value, required Color color, double? minOpacity, double? maxOpacity, String? text})
Creates a MapColorMapper.
const

Properties

color Color
Specifies the color applies to the shape or bubble based on the value. [...]
final
from double?
Sets the range start for the color mapping. [...]
final
hashCode int
The hash code for this object. [...]
read-only, override
maxOpacity double?
Specifies the maximum opacity applies to the shape or bubble while using from and to. [...]
final
minOpacity double?
Specifies the minimum opacity applies to the shape or bubble while using from and to. [...]
final
runtimeType Type
A representation of the runtime type of the object.
read-only, inherited
text String?
Specifies the text to be used for the legend item. [...]
final
to double?
Sets the range end for the color mapping. [...]
final
value String?
Sets the value for the equal color mapping. [...]
final

Methods

noSuchMethod(Invocation invocation) → dynamic
Invoked when a non-existent method or property is accessed. [...]
inherited
toString() String
A string representation of this object. [...]
inherited

Operators

operator ==(Object other) bool
The equality operator. [...]
override