Innovación Tecnologica de Diseño y 3D

Acerca de mi

Jaime Rosales

Sr. Technical Evangelist at Autodesk

Quien es ?

3 ejemplos de diseño

Pedal Logic - ECO+

SmartFlower - Paneles Fotovoltaicos Inteligentes

Uncharted Play - Soccket

Diseño, un pilar para la educacion?

La familia de Software de 123D Apps

Web 3D

Jelly Fish Demo

3D Water Demo

Particles Demo

3D Kia motors Demo

WebGL

JavaScript API que permite a los navegadores web hacer render de 3D

No es W3C standard...

Es una tecnologia bastante dificil dominar

Autodesk ha creado un viewer en 3D/2D ...

Es gratis!

Compremos una silla Aeron...

Preferirian ver esto en su e-commerce website..

o esto?

Formatos Soportados

ipt, neu, stla, stl, xlsx, jt, jpg, skp, prt, dwf, xls, png, sldasm, step, dwg, zip, nwc, model, sim, stp, ste, f3d, pdf, iges, dwt, catproduct, csv, igs, sldprt, cgr, 3dm, sab, obj, pptx, cam360, jpeg, bmp, gbxml, exp, ppt, doc, wire, ige, rcp, txt, dae, x_b, 3ds, rtf, rvt, g, sim360, iam, asm, dlv3, x_t, pps, session, xas, xpr, docx, catpart, stlb, tiff, nwd, sat, fbx, smb, smt, ifc, dwfx, tif

Ok, yo quiero un website asi, Como empiezo???

developer.autodesk.com

Tweet me @AfroJme

The Stack

Server-Side

REST API

Server-side Workflow

• Register + create app
• Get access token
• Create bucket
• Upload file/object to bucket
• Request translation
• Access from client

Client-Side

JavaScript API

En su pagina

<link rel="stylesheet" href="https://viewing.api.autodesk.com/viewingservice/v1/viewers/style.css" type="text/css">
                            <script src="https://viewing.api.autodesk.com/viewingservice/v1/viewers/viewer3D.min.js"></script>

<div id="viewer"></div>

Iniciamos el JavaScript

function initialize() {
                var options = {
                'document' : 'urn:(Your own URN)',
                'env':'AutodeskProduction',
                'getAccessToken': getToken,
                'refreshToken': getToken,
                };
                var viewerElement = document.
                    getElementById('viewer');
                var viewer = new Autodesk.
                    Viewing.Viewer3D(viewerElement, {});

                Autodesk.Viewing.Initializer(options,function() {
                viewer.initialize();
                loadDocument(viewer, options.document);
                });
                }

token

function getToken() {
                            return "GX6OONHlQ9qoVaCSmBqJvqPFUT5i";
                            }

Es aconsejable escribir su propio servicio de Token

loadDocument

function loadDocument(viewer, documentId) {
                    // Find the first 3d geometry and load that.
                    Autodesk.Viewing.Document.load(documentId,
                    function(doc) {
                    var geometryItems = [];
                    geometryItems = Autodesk.Viewing.Document.
                    getSubItemsWithProperties(doc.getRootItem(), {
                    'type' : 'geometry',
                    'role' : '3d'
                    }, true);

                    if (geometryItems.length > 0) {
                     viewer.load(doc.
                        getViewablePath(geometryItems[0]));
                    }
                    }, function(errorMsg) {// onErrorCallback
                    alert("Load Error: " + errorMsg);
                    });
                    }

Resources

• Developer Portal
• Samples page on GitHub
  • quick start guides
  • sample apps
  • libraries
• Esta presentacion esta en http://jaimerosales.github.io/fit-guatemala
• Pregunten, No sean Timidos