I've been attempting to integrate a three.js demo from http://jsfiddle.net/hfj7gm6t/ into my polymer app, but I'm encountering an error message:
com-model-viewer.html:33 Uncaught TypeError: Cannot read property 'myview' of undefined
<link rel='import' href='../../../bower_components/polymer/polymer.html'>
<dom-module id='com-model-viewer'>
<template>
<ul id='myview'>
</ul>
</template>
<script>
Polymer({
is:'com-model-viewer',
ready: function(){
console.log(this);
var camera, scene, renderer;
var geometry, material, mesh;
init();
animate();
function init(){
console.log();
camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 1, 10000);
camera.position.z = 1000;
scene = new THREE.Scene();
geometry = new THREE.BoxGeometry(200, 200, 200);
material = new THREE.MeshBasicMaterial({
color: 0xff0000,
wireframe: true
});
mesh = new THREE.Mesh(geometry, material);
scene.add(mesh);
renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
Polymer.dom( this.$.myview ).appendChild(node);
}
function animate(){
requestAnimationFrame(animate);
mesh.rotation.x += 0.01;
mesh.rotation.y += 0.02;
renderer.render(scene, camera);
}
}
});
</script>
<script src='../../../node_modules/three/three.min.js'></script>
</dom-module>