Flutter Model Viewer doesn't display anything

Question

I am trying to use flutter's model viewer plus (https://pub.dev/packages/model_viewer_plus) and I have integrated it but the ModelViewer does not get displayed in my application. The screen works, but the model is not displayed at all. I have tried to put the model directly with the screen file and even in assets folder, but nothing seems to work (tried online model url as well but still wont work).

This is my screen file

import 'package:flutter/material.dart';
import 'package:model_viewer_plus/model_viewer_plus.dart';

class PlaceModel extends StatelessWidget {
  const PlaceModel({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text("Model Viewer")),
        body: ModelViewer(
          backgroundColor: Colors.teal,
          src: "E:\\BuildVisionFYP\\build_vision_fyp\\public\\models\\Duck.glb",
          alt: "A 3D model of an astronaut",
          ar: true,
          autoRotate: true,
          cameraControls: true,
        ),
      ),
    );
  }
}

this is my pubspec.yaml

name: build_vision_fyp
description: A new Flutter project.

publish_to: 'none' # Remove this line if you wish to publish to pub.dev

version: 1.0.0+1

environment:
  sdk: '>=3.0.1 <4.0.0'

dependencies:
  flutter:
    sdk: flutter

  cupertino_icons: ^1.0.2
  flutter_svg: ^2.0.5
  animations: ^2.0.7
  flutter_archive: ^5.0.0
  path_provider: ^2.0.15
  model_viewer_plus: ^1.5.0
  http: ^0.13.4

dev_dependencies:
  flutter_test:
    sdk: flutter


  flutter_lints: ^2.0.0

flutter:

  uses-material-design: true

  assets:
    - assets/images/
    - assets/icons/
    - assets/models/
    - public/models/

I am attaching a screenshot of the screen as well Screenshot

I get this in log as well:

HTML generated for model_viewer_plus:
<meta name="viewport" content="width=device-width, initial-scale=1" />
<style>
    body,
    model-viewer {
        width: 100%;
        height: 100%;
        margin: 0;
        padding: 0;
    }

    /* other-css */
</style>

<model-viewer src="E:\BuildVisionFYP\build_vision_fyp\public\models\Duck.glb" alt="A 3D model of an astronaut" ar camera-controls auto-rotate style="background-color: rgba(0, 150, 136, 255); ">
</model-viewer>

Kindly help thankyou

Answer 1

use forward slash

"E:/BuildVisionFYP/build_vision_fyp/public/models/Duck.glb"

instade of

"E:\\BuildVisionFYP\\build_vision_fyp\\public\\models\\Duck.glb"

to locate the files.