Crash in Three.dart "Hello World" project

Issue

I’ve developed simple project using three.dart framework. It launches and shows web page ok. But after 3-5 seconds it crashes with unknown error. Dart editor and browser don’t show the reason why it crashed

Here is a code:

import 'dart:html';
import 'dart:math' as Math;
import 'package:three/three.dart'; 

class MyClass {
  Element container;
  PerspectiveCamera camera;
  Scene scene;
  CanvasRenderer renderer;
  Mesh plane;
  num targetRotation;
  num targetRotationOnMouseDown;
  num windowHalfX;
  num windowHalfY;
  var evtSubscriptions = []; 

  void run() {
    init();
    animate(0);
  } 

  void init() {
    targetRotation = 0;
    targetRotationOnMouseDown = 0;
    windowHalfX = window.innerWidth / 2;
    windowHalfY = window.innerHeight / 2; 
    container = new Element.tag('div');
    document.body.nodes.add( container );
    Element info = new Element.tag('div');
    info.style.position = 'absolute';
    info.style.top = '10px';
    info.style.width = '100%';
    info.style.textAlign = 'center';
    info.innerHtml = 'Drag to spin the cube';
    container.nodes.add( info );

    scene = new Scene();
    camera = new PerspectiveCamera( 70.0, window.innerWidth / window.innerHeight, 1.0, 1000.0 );
    camera.position.y = 150.0;
    camera.position.z = 500.0;
    scene.add( camera ); 

    // Plane
    plane = new Mesh( new PlaneGeometry( 200.0, 200.0 ), null);
    scene.add( plane );

    renderer = new CanvasRenderer();
    renderer.setSize( window.innerWidth, window.innerHeight );
    container.nodes.add( renderer.domElement );
} 

void render() {
    renderer.render( scene, camera );
  } 

animate(num time) {
    window.requestAnimationFrame(animate);
    render();
  }
} 

void main() {
  new Canvas_Geometry_Cube().run();
}

How to fix a crash?

Solution

I found out the problem. It works with Web GL properly (NOT canvas).

Answered By – Serge

Answer Checked By – Jay B. (FlutterFixes Admin)

Leave a Reply

Your email address will not be published.