two.js

How can I interpret an extrenal svg file in two.js

由 心已入冬 提交于 2020-01-06 01:36:10
问题 Is there any way I can interpret an external svg file with object tag in two.js? I tried in the way below but.. HTML <object type="image/svg+xml" data="./svg/mydrawing.svg" id="mysvg"></object> JS var mySvg = document.getElementById("mysvg").contentDocument; var shape = two.interpret(mySvg); console.log(shape); //in console: Uncaught TypeError: Cannot call method 'toLowerCase' of undefined It's nice if I can import an external .svg file as my svg file is too big to write in HTML as Inline SVG

Add an HTML class to a DOM element controlled by two.js

由 ￡可爱￡侵袭症＋ 提交于 2019-12-13 02:13:12
问题 I'm trying to add a class and ID to specific Two.js objects in this project: http://itpblog.evejweinberg.com/Homework/Open/ (click a few times to play) If I console.log the word 'background' I see that these are two.js objects but I can't seem to use css or jquery to add a class/ID to them. Any help is appreciated! I even tried adding it to the whole project but that did not work: $(document.body).addClass("dropshadow"); 回答1: two.js entities are not DOM elements themselves, but each Scene,

Create dynamic Two.js variables to involve individual click event

由 允我心安 提交于 2019-12-11 12:07:34
问题 In creating a two.js object, here are the parts: var circle1 = two.makeCircle(676,326,25); circle1.noStroke().fill = getRandomColor(); circle1.domElement = document.querySelector('#two-' + circle1.id); $(circle1.domElement) .css('cursor', 'pointer') .click(function(e) { circle1.fill = getNonMainRandomColor(getRandomColor()); }); I tried to save all the necessary parameters in an array as such: [x position, y position, radius, color] So I have the function function showCircles(array) { for(var

Poor performance - SVG animations

由 你离开我真会死。 提交于 2019-11-29 13:16:19
So I'm creating some animations for a client and I've been playing with two.js because I liked its SVG capabilities. Unfortunately I'm having issues with performance. I'm plotting 100 circles on the screen. Each circle contains 6 further circles for a total of 700 circles being rendered on load. The circles react to mouse movements on the x-axis and cascade slowly downwards on the y-axis. Currently in Chrome its only running at around 32FPS. In Firefox it barely even works! I've also tried two.js's webgl renderer but while there is a slight performance increase, the elements just don't look as

Poor performance - SVG animations

由 心不动则不痛 提交于 2019-11-28 06:51:01
问题 So I'm creating some animations for a client and I've been playing with two.js because I liked its SVG capabilities. Unfortunately I'm having issues with performance. I'm plotting 100 circles on the screen. Each circle contains 6 further circles for a total of 700 circles being rendered on load. The circles react to mouse movements on the x-axis and cascade slowly downwards on the y-axis. Currently in Chrome its only running at around 32FPS. In Firefox it barely even works! I've also tried
订阅 two.js