Skip to content

Instantly share code, notes, and snippets.

@javad-zobeidi
Last active June 30, 2022 11:02
Show Gist options
  • Save javad-zobeidi/957df3e22c3e5dc57ea86156b963247f to your computer and use it in GitHub Desktop.
Save javad-zobeidi/957df3e22c3e5dc57ea86156b963247f to your computer and use it in GitHub Desktop.
Flutter map Overlay Image (Persian gulf)
import 'package:flutter/material.dart';
import 'package:flutter_map/flutter_map.dart';
import 'package:latlong2/latlong.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MapPage(),
);
}
}
class MapPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
var overlayImages = <OverlayImage>[
OverlayImage(
bounds: LatLngBounds(LatLng(26.6971, 50.4939), LatLng(27.6848, 51.8521)),
opacity: 1,
imageProvider: const NetworkImage('https://i.imgur.com/qJfXZ9l.jpg')),
];
return Scaffold(
appBar: AppBar(title: const Text('FlutterMap')),
body: Padding(
padding: const EdgeInsets.all(8.0),
child: Column(
children: [
Flexible(
child: FlutterMap(
options: MapOptions(
center: LatLng(27.6848, 51.8521),
),
layers: [
TileLayerOptions(
urlTemplate:
'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
subdomains: ['a', 'b', 'c']),
OverlayImageLayerOptions(overlayImages: overlayImages)
],
),
),
],
),
),
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment