在 flutter 中实施 3d model

Question

I want to ask regarding implementing 3d model in flutter using HTML link. Does anyone knows how to implement it. I have tried babylonjs_viewer and model_viewer_plus packages examples but they didn't work for me. If anyone can help me with it, it will be great

Thank you

Answer 1

Would be great if you could provide more information regarding the error.

But this is how implemented my 3D model in a Flutter web browser.

import 'dart:html';

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter/src/widgets/container.dart';
import 'package:flutter/src/widgets/framework.dart';
import 'package:model_viewer_plus/model_viewer_plus.dart';

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

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      height: MediaQuery.of(context).size.height / 2.5,
      child: ModelViewer(
        src: "assets/3D_model/my_model.glb",
        alt: "A 3D model of Ritchie's model",
        autoRotate: false,
        cameraOrbit: "15deg 90deg -110m",
        cameraTarget: "0m 1.7m 0m",
        fieldOfView: "180deg",
      ),
    );
  }
}

I created my 3D model in a separate file, however, it's the same if you wanted to implement directly into the body of the app.