Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

#

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

Reworked markers #1659

Merged
merged 5 commits into from
Oct 6, 2023
Merged

Reworked markers #1659

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
a24e3f6
Minor: simplify marker alignment handling, fix naming, and allow for …
ignatz Sep 21, 2023
6819d4e
Reworked markers
JaffaKetchup Oct 5, 2023
2907ca4
Improved performance
JaffaKetchup Oct 6, 2023
864c4c4
Merge branch 'master' into const_markers
JaffaKetchup Oct 6, 2023
a6d5c7d
Merge branch 'const_markers' of https://github.com/ignatz/flutter_map…
JaffaKetchup Oct 6, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
83 changes: 34 additions & 49 deletions example/lib/pages/animated_map_controller.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,9 +20,30 @@ class AnimatedMapControllerPageState extends State<AnimatedMapControllerPage>
static const _inProgressId = 'AnimatedMapController#MoveInProgress';
static const _finishedId = 'AnimatedMapController#MoveFinished';

static const london = LatLng(51.5, -0.09);
static const paris = LatLng(48.8566, 2.3522);
static const dublin = LatLng(53.3498, -6.2603);
static const _london = LatLng(51.5, -0.09);
static const _paris = LatLng(48.8566, 2.3522);
static const _dublin = LatLng(53.3498, -6.2603);

static const _markers = [
Marker(
width: 80,
height: 80,
point: _london,
child: FlutterLogo(key: ValueKey('blue')),
),
Marker(
width: 80,
height: 80,
point: _dublin,
child: FlutterLogo(key: ValueKey('green')),
),
Marker(
width: 80,
height: 80,
point: _paris,
child: FlutterLogo(key: ValueKey('purple')),
),
];

late final MapController mapController;

Expand Down Expand Up @@ -88,36 +109,6 @@ class AnimatedMapControllerPageState extends State<AnimatedMapControllerPage>

@override
Widget build(BuildContext context) {
final markers = <Marker>[
Marker(
width: 80,
height: 80,
point: london,
builder: (ctx) => Container(
key: const Key('blue'),
child: const FlutterLogo(),
),
),
Marker(
width: 80,
height: 80,
point: dublin,
builder: (ctx) => const FlutterLogo(
key: Key('green'),
textColor: Colors.green,
),
),
Marker(
width: 80,
height: 80,
point: paris,
builder: (ctx) => Container(
key: const Key('purple'),
child: const FlutterLogo(textColor: Colors.purple),
),
),
];

return Scaffold(
appBar: AppBar(title: const Text('Animated MapController')),
drawer: buildDrawer(context, AnimatedMapControllerPage.route),
Expand All @@ -130,21 +121,15 @@ class AnimatedMapControllerPageState extends State<AnimatedMapControllerPage>
child: Row(
children: <Widget>[
MaterialButton(
onPressed: () {
_animatedMapMove(london, 10);
},
onPressed: () => _animatedMapMove(_london, 10),
child: const Text('London'),
),
MaterialButton(
onPressed: () {
_animatedMapMove(paris, 5);
},
onPressed: () => _animatedMapMove(_paris, 5),
child: const Text('Paris'),
),
MaterialButton(
onPressed: () {
_animatedMapMove(dublin, 5);
},
onPressed: () => _animatedMapMove(_dublin, 5),
child: const Text('Dublin'),
),
],
Expand All @@ -157,9 +142,9 @@ class AnimatedMapControllerPageState extends State<AnimatedMapControllerPage>
MaterialButton(
onPressed: () {
final bounds = LatLngBounds.fromPoints([
dublin,
paris,
london,
_dublin,
_paris,
_london,
]);

mapController.fitCamera(
Expand All @@ -174,9 +159,9 @@ class AnimatedMapControllerPageState extends State<AnimatedMapControllerPage>
MaterialButton(
onPressed: () {
final bounds = LatLngBounds.fromPoints([
dublin,
paris,
london,
_dublin,
_paris,
_london,
]);

final constrained = CameraFit.bounds(
Expand Down Expand Up @@ -204,7 +189,7 @@ class AnimatedMapControllerPageState extends State<AnimatedMapControllerPage>
userAgentPackageName: 'dev.fleaflet.flutter_map.example',
tileUpdateTransformer: _animatedMoveTileUpdateTransformer,
),
MarkerLayer(markers: markers),
const MarkerLayer(markers: _markers),
],
),
),
Expand Down
14 changes: 7 additions & 7 deletions example/lib/pages/home.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -145,31 +145,31 @@ class _HomePageState extends State<HomePage> {
'https://tile.openstreetmap.org/{z}/{x}/{y}.png',
userAgentPackageName: 'dev.fleaflet.flutter_map.example',
),
MarkerLayer(
const MarkerLayer(
markers: [
Marker(
width: 80,
height: 80,
point: const LatLng(51.5, -0.09),
builder: (ctx) => const FlutterLogo(
point: LatLng(51.5, -0.09),
child: FlutterLogo(
textColor: Colors.blue,
key: ObjectKey(Colors.blue),
),
),
Marker(
width: 80,
height: 80,
point: const LatLng(53.3498, -6.2603),
builder: (ctx) => const FlutterLogo(
point: LatLng(53.3498, -6.2603),
child: FlutterLogo(
textColor: Colors.green,
key: ObjectKey(Colors.green),
),
),
Marker(
width: 80,
height: 80,
point: const LatLng(48.8566, 2.3522),
builder: (ctx) => const FlutterLogo(
point: LatLng(48.8566, 2.3522),
child: FlutterLogo(
textColor: Colors.purple,
key: ObjectKey(Colors.purple),
),
Expand Down
16 changes: 8 additions & 8 deletions example/lib/pages/many_markers.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import 'package:flutter_map/flutter_map.dart';
import 'package:flutter_map_example/widgets/drawer.dart';
import 'package:latlong2/latlong.dart';

const maxMarkersCount = 5000;
const maxMarkersCount = 10000;

/// On this page, [maxMarkersCount] markers are randomly generated
/// across europe, and then you can limit them with a slider
Expand Down Expand Up @@ -35,11 +35,8 @@ class _ManyMarkersPageState extends State<ManyMarkersPage> {
for (var x = 0; x < maxMarkersCount; x++) {
allMarkers.add(
Marker(
point: LatLng(
doubleInRange(r, 37, 55),
doubleInRange(r, -9, 30),
),
builder: (context) => const Icon(
point: LatLng(doubleInRange(r, 37, 55), doubleInRange(r, -9, 30)),
child: const Icon(
Icons.circle,
color: Colors.red,
size: 12,
Expand Down Expand Up @@ -85,8 +82,11 @@ class _ManyMarkersPageState extends State<ManyMarkersPage> {
userAgentPackageName: 'dev.fleaflet.flutter_map.example',
),
MarkerLayer(
markers: allMarkers.sublist(
0, min(allMarkers.length, _sliderVal))),
markers: allMarkers.sublist(
0,
min(allMarkers.length, _sliderVal),
),
),
],
),
),
Expand Down
79 changes: 32 additions & 47 deletions example/lib/pages/map_controller.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,14 +14,35 @@ class MapControllerPage extends StatefulWidget {
}
}

const LatLng london = LatLng(51.5, -0.09);
const LatLng paris = LatLng(48.8566, 2.3522);
const LatLng dublin = LatLng(53.3498, -6.2603);

class MapControllerPageState extends State<MapControllerPage> {
late final MapController _mapController;
double _rotation = 0;

static const _london = LatLng(51.5, -0.09);
static const _paris = LatLng(48.8566, 2.3522);
static const _dublin = LatLng(53.3498, -6.2603);

static const _markers = [
Marker(
width: 80,
height: 80,
point: _london,
child: FlutterLogo(key: ValueKey('blue')),
),
Marker(
width: 80,
height: 80,
point: _dublin,
child: FlutterLogo(key: ValueKey('green')),
),
Marker(
width: 80,
height: 80,
point: _paris,
child: FlutterLogo(key: ValueKey('purple')),
),
];

@override
void initState() {
super.initState();
Expand All @@ -30,36 +51,6 @@ class MapControllerPageState extends State<MapControllerPage> {

@override
Widget build(BuildContext context) {
final markers = <Marker>[
Marker(
width: 80,
height: 80,
point: london,
builder: (ctx) => Container(
key: const Key('blue'),
child: const FlutterLogo(),
),
),
Marker(
width: 80,
height: 80,
point: dublin,
builder: (ctx) => const FlutterLogo(
key: Key('green'),
textColor: Colors.green,
),
),
Marker(
width: 80,
height: 80,
point: paris,
builder: (ctx) => Container(
key: const Key('purple'),
child: const FlutterLogo(textColor: Colors.purple),
),
),
];

return Scaffold(
appBar: AppBar(title: const Text('MapController')),
drawer: buildDrawer(context, MapControllerPage.route),
Expand All @@ -72,21 +63,15 @@ class MapControllerPageState extends State<MapControllerPage> {
child: Row(
children: <Widget>[
MaterialButton(
onPressed: () {
_mapController.move(london, 18);
},
onPressed: () => _mapController.move(_london, 18),
child: const Text('London'),
),
MaterialButton(
onPressed: () {
_mapController.move(paris, 5);
},
onPressed: () => _mapController.move(_paris, 5),
child: const Text('Paris'),
),
MaterialButton(
onPressed: () {
_mapController.move(dublin, 5);
},
onPressed: () => _mapController.move(_dublin, 5),
child: const Text('Dublin'),
),
],
Expand All @@ -99,9 +84,9 @@ class MapControllerPageState extends State<MapControllerPage> {
MaterialButton(
onPressed: () {
final bounds = LatLngBounds.fromPoints([
dublin,
paris,
london,
_dublin,
_paris,
_london,
]);

_mapController.fitCamera(
Expand Down Expand Up @@ -163,7 +148,7 @@ class MapControllerPageState extends State<MapControllerPage> {
'https://tile.openstreetmap.org/{z}/{x}/{y}.png',
userAgentPackageName: 'dev.fleaflet.flutter_map.example',
),
MarkerLayer(markers: markers),
const MarkerLayer(markers: _markers),
],
),
),
Expand Down
Loading