kovacsv / JSModeler

A JavaScript framework to create and visualize 3D models.
MIT License
655 stars 123 forks source link

Generating geodesic figures #3

Closed aenciso closed 10 years ago

aenciso commented 10 years ago

Hi,

First of all thanks for this amazing library!! Quick question is there any way of generate a geodesic figure like the attached ones with built in functions? or perhaps create a truncate Icosahedron with an specific number of panels?

f1 f2

Thanks

aenciso commented 10 years ago

Thanks for replying so quickly. I'll have a look at the triangulated sphere then.

On the other hand, I'm using also the GenerateTruncatedIcosahedron function, is there any way of add an specific image to each material instead of colours?

I can see from JSM.Material that texture is a parameter, and I'm trying something like this but the texture is not being displayed

var texture = THREE.ImageUtils.loadTexture( "scripts/textures/leather.jpg" ); texture.wrapS = THREE.RepeatWrapping; texture.wrapT = THREE.RepeatWrapping; texture.repeat.set( 4, 4 ); materials.AddMaterial (new JSM.Material (0xcc3333, 0xcc3333, 1, texture,50,50));

Thanks

kovacsv commented 10 years ago

Unfortunately I deleted my previous comment so here it is again :)

There is no built-in function to generate this kind of shape. This is not even a regular polyhedron so its polygons have no equal length edges (truncated icosahedron is a regular archimedean solid).

Maybe you can try out this function: JSM.GenerateTriangulatedSphere (1, 3)

It generates a sphere from triangles. Maybe you can create hexagons with merging six neighboring triangles. triangulatedsphere

kovacsv commented 10 years ago

The correct usage of textured material is to give the texture location as texture parameter:

materials.AddMaterial (new JSM.Material (
    0xffffff, 0xffffff, 1.0, 'scripts/textures/leather.jpg', 50.0, 50.0));
aenciso commented 10 years ago

Thanks for your help, but now I've just got white instead of the texture, do I need to change the opacity or something else?

Thanks

kovacsv commented 10 years ago

This is strange. The below code works for me:

var materials = new JSM.Materials ();
materials.AddMaterial (new JSM.Material (0xffffff, 0xffffff, 1.0, 'texture.jpg', 1.0, 1.0));

var body = JSM.GenerateSolidWithRadius ('TruncatedIcosahedron', 1.0);
body.SetPolygonsMaterialIndex (0);

var meshes = JSM.ConvertBodyToThreeMeshes (body, materials);

If it not works for you, email me your code, and I will check it.

aenciso commented 10 years ago

I'm modifying your solids example code. Mine below:

var body = null; var viewer = null; var lastName = 'TruncatedIcosahedron'; var coloredFaces = true; function SetBody (name) { lastName = name; viewer.RemoveBodies (); body = JSM.GenerateSolidWithRadius (name, 1.0); if (coloredFaces) { materials = new JSM.Materials (); //materials.AddMaterial (new JSM.Material (0x008ab8, 0x008ab8)); //materials.AddMaterial (new JSM.Material (0x279b61, 0x279b61)); body.SetPolygonsMaterialIndex (0); //meshes = JSM.ConvertBodyToThreeMeshes (body, materials);

materials.AddMaterial (new JSM.Material (0xffffff, 0xffffff, 1.0, 'scripts/textures/leather.jpg', 1.0, 1.0));

var vertexCountToColor = []; var currentColor = 0;

var i, polygon, vertexCount; for (i = 0; i < body.PolygonCount (); i++) { polygon = body.GetPolygon (i); vertexCount = polygon.VertexIndexCount (); if (vertexCountToColor[vertexCount] === undefined) { vertexCountToColor[vertexCount] = currentColor;

currentColor++; } polygon.SetMaterialIndex (vertexCountToColor[vertexCount]); } } else { var materials = new JSM.Materials (); materials.AddMaterial (new JSM.Material (0xffffff, 0xffffff)); body.SetPolygonsMaterialIndex (0); } viewer.AddBody (body, materials); viewer.Draw (); } function Load () { var viewerSettings = { cameraEyePosition : [3, 2, 3], cameraCenterPosition : [0.0, 0.0, 0.0], cameraUpVector : [0.0, 0.0, 1.0], drawMode : 'HiddenLinePainter' };

viewer = new JSM.SoftwareViewer (); var success = viewer.Start ('example', viewerSettings);

SetBody (lastName); } window.onload = function () { Load (); }

On 22 January 2014 16:39, Viktor Kovacs notifications@github.com wrote:

This is strange. The below code works for me:

var materials = new JSM.Materials (); materials.AddMaterial (new JSM.Material (0xffffff, 0xffffff, 1.0, 'texture.jpg', 1.0, 1.0));

body = JSM.GenerateSolidWithRadius ('TruncatedIcosahedron', 1.0); body.SetPolygonsMaterialIndex (0);

var meshes = JSM.ConvertBodyToThreeMeshes (body, materials);

If it not works for, email me your code, and I will check it.

— Reply to this email directly or view it on GitHubhttps://github.com/kovacsv/JSModeler/issues/3#issuecomment-33040876 .

kovacsv commented 10 years ago

You are using JSM.SoftwareViewer, and it can't handle textures. It renders to SVG or to canvas without WebGL. Use JSM.Viewer instead which uses Three.js and WebGL.