Three.js: SVG comme texture?

Créé le 12 févr. 2012 · 5Commentaires · Source: mrdoob/three.js

J'ai rouge cette question # 814

Et aussi je cours sur cette bibliothèque js: http://code.google.com/p/canvg/ qui peut convertir SVG en canevas en données.

Voici mon code:

var imageCanvas2 = document.createElement("canvas");
canvg(imageCanvas2, 'images/46.svg');
var imag = imageCanvas2.toDataURL('image/png');   // --> here is the converted image data

var cubeMaterial = [new THREE.MeshBasicMaterial({
    map : THREE.ImageUtils.loadTexture(imag)
})];

Cela me donne l'erreur: "Chargement d'image cross-origin refusé par la politique de partage de ressources cross-origin."

Quelles sont mes options ici?

Je dois également mentionner que WebGL n'est pas une option car je vais l'utiliser sur des appareils mobiles qui ne prennent pas en charge WebGL.

Question

Source

Dino4674

Commentaire le plus utile

Mon dieu ... Je ne peux pas croire à quel point c'est stupide.
Cela fonctionne également sur iOS.

J'ai une image SVG qui est de la même couleur que l'arrière-plan de WebView, c'est pourquoi je ne l'ai pas vue: D
Au moins ça marche et quelqu'un peut rire maintenant quand on lit ceci: D

Dino4674 le 12 févr. 2012

😄28

Tous les 5 commentaires

Je pense que vous rencontrez le même problème # 1305.

mrdoob le 12 févr. 2012

J'ai essayé quelque chose basé sur ça:

var imageCanvas2 = document.createElement("canvas");
canvg(imageCanvas2, 'images/46.svg');
var imag = imageCanvas2.toDataURL('image/png');

var texture = new THREE.Texture(imag);
texture.needsUpdate = true;

//Now I have to make material from this so I could apply it to Mesh:

var cubeMaterial = new THREE.MeshBasicMaterial({
    map : texture  /////something like this. This throws errors.
});

cube = new THREE.Mesh(geometry, cubeMaterial);

Je n'ai pas trouvé d'exemple de cela. Pouvez-vous m'aider?

Dino4674 le 12 févr. 2012

var imageCanvas2 = document.createElement("canvas");
canvg(imageCanvas2, 'images/46.svg');

var texture = new THREE.Texture(imageCanvas2);
texture.needsUpdate = true;

mrdoob le 12 févr. 2012

👍3

Eh bien, la bonne chose est que cela fonctionne. La mauvaise chose est que cela ne fonctionne pas sur iPhone.
Merci, je vais devoir comprendre maintenant pourquoi cela ne fonctionne pas sur iOS.

Dino4674 le 12 févr. 2012

Mon dieu ... Je ne peux pas croire à quel point c'est stupide.
Cela fonctionne également sur iOS.

J'ai une image SVG qui est de la même couleur que l'arrière-plan de WebView, c'est pourquoi je ne l'ai pas vue: D
Au moins ça marche et quelqu'un peut rire maintenant quand on lit ceci: D

Dino4674 le 12 févr. 2012

😄28

Cette page vous a été utile?

0 / 5 - 0 notes