Changes between Version 2 and Version 3 of jsc3d/prikazno_okno


Ignore:
Timestamp:
Dec 19, 2013, 10:34:26 AM (6 years ago)
Author:
ptomsic
Comment:

--

Legend:

Unmodified
Added
Removed
Modified
  • jsc3d/prikazno_okno

    v2 v3  
    1 == Prikaz kosa- nastavitev velikosti prikaznega okna ==
     1== Prikaz kosa- primer ==
    22
    3 Velikokrat nastanejo problemi z velikostjo prikaznega okna, ker si lahko spletno stran ogledujemo na večih različnih napravah, ki nimajo enake resolucije (PC, prenosnik, tablica, telefon). Problem se še bolj zaplete ko začnemo spreminjati velikost odprtega okna brskalnika.
    4 Ugodno je, da se prikaz modela prilagaja trenutni velikosti okna brskalnika. Tako nastavimo začetno širino in višino:
    5 {{{
    6   canvas.width = 0.9*window.innerWidth;         <!-- nastavitev zacetne sirine prikaznega okna -->
    7   canvas.height = canvas.width/1.6;             <!-- nastavitev zacetne visine prikaznega okna -->
    8 }}}
     3[[BR]][[BR]]
    94
    10 Kljub nastavitvi velikosti prikaznega okna pa se le ta ne prilagaja spremembi velikosti brskalnika, ali pa rotaciji zaslona na tabličnih računalnikih/ mobitelih. Potrebno je napraviti še funkcijo za osveževanje prikaza:
    11 {{{
    12 #!javascript
    13 window.onresize = function() {
    14   var canvas = document.getElementById('cv');
    15   canvas.width = 0.9*window.innerWidth;         <!-- nastavitev sirine prikaznega okna ob osvezitvi -->
    16   canvas.height = canvas.width/1.6;             <!-- nastavitev visine prikaznega okna ob osvezitvi -->
    17   viewer.ctx = canvas.getContext('2d');
    18   viewer.canvasData = viewer.ctx.getImageData(0, 0, canvas.width, canvas.height);
    19   viewer.frameWidth = canvas.width;             <!-- nastavitev sirine modelnega okna ob osvezitvi -->
    20   viewer.frameHeight = canvas.height;           <!-- nastavitev sirine modelnega okna ob osvezitvi -->
    21   viewer.generateBackground();                  <!-- ponovni izris ozadja -->
    22   viewer.update();
    23 }
    24 }}}
    255
    266{{{
     
    3515  canvas.height = canvas.width/1.6;             <!-- nastavitev zacetne visine prikaznega okna -->
    3616  viewer = new JSC3D.Viewer(canvas);            <!-- Ime prikaznega okna -->
    37   viewer.setParameter('SceneUrl', '/vaje/raw-attachment/wiki/jsc3d/elbow.STL'); <!-- Model za prikaz -->
     17  viewer.setParameter('BackgroundColor1', '#CCCCCC');   <!-- Barva ozadja- zgoraj -->
     18  viewer.setParameter('BackgroundColor2', '#003366');   <!-- Barva ozadja- spodaj -->
     19  viewer.setParameter('InitRotationX', 30);     <!-- rotacija zacetnega pogleda okoli X osi -->
     20  viewer.setParameter('InitRotationY', 30);     <!-- rotacija zacetnega pogleda okoli Y osi -->
     21  viewer.setParameter('InitRotationZ', 30);     <!-- rotacija zacetnega pogleda okoli Z osi -->
     22  viewer.setParameter('SceneUrl', '/vaje/raw-attachment/wiki/jsc3d/prikazno_okno/Primer_01.STL'); <!-- Model za prikaz -->
     23  viewer.setParameter('ModelColor','#FFFFFF');  <!-- Sprememba barve kosa -->
     24  viewer.setParameter('RenderMode','smooth');   <!-- Zgladitev prikaza modela -->
     25  viewer.setParameter('CreaseAngle', 15);       <!-- Prilagoditev senčenja preko ostrih prehodov -->
     26  setInterval(function(){viewer.rotate(0, 1, 0); viewer.update();}, 60); <!-- animacija- rotacija -->
    3827  viewer.init();
    3928  viewer.update();