How to clamp background image in Flutter?

Question

I've created a Flutter application to show a custom zoomed in map of Earth and create airplane routes from one city to another (Indiana Jones-style).

The problem is that when I drag the map, it eventually goes off the boundaries of the screen, leaving me with a blank white background.

I added a clampImage method to the InteractionViewer onInteractionEnd call, but I was unable to go further without getting an exception or it just moving the image wrongly. How could I implement this method to clamp this image so that the upper left corner never goes more than (0, 0) position and the bottom right corner never exceeds the (image.width, image.height) position?

class MyHomePage extends StatelessWidget {
  final TransformationController _transformationController =
      TransformationController();

  @override
  Widget build(BuildContext context) {
    _transformationController.value = Matrix4.identity()..scale(3.0);

    return Scaffold(
      appBar: AppBar(
        title: Text('Earth Routes'),
      ),
      body: InteractiveViewer(
        transformationController: _transformationController,
        boundaryMargin: EdgeInsets.all(double.infinity),
        minScale: 0.5,
        maxScale: 5.0,
        constrained: false,
        child: Center(
          child: Image.asset(
            'assets/images/Earth.png',
            fit: BoxFit.cover,
          ),
        ),
        onInteractionEnd: (_) {
          _clampImage(context);
        },
      ),
    );
  }