[X3D-Public] X3DOM: Proximity Sensor
Dark Before Dawn
dark.before.dawn at gmail.com
Mon May 16 03:56:41 PDT 2011
Hi Joe,
this is my prefered way to implement such behaviour too. Your code
example works like a charm in BSContact. There is unfortunately no
ProximitySensor Node in X3DOM and no chance to adopt your example.
Cheers
Darky
Am 13.05.2011 21:05, schrieb Joe D Williams:
> Just in case, re ProximitySensor and Viewpoint, try this in BSContact
> or Instant or any other X3D player. I think I see what you were aiming
> at with the navigation increeasing speed as you move. As for Examine
> not giving you data, try listening for a change in viewpoint
> orientation, like this one does. Here, the viewpoint data is updated
> when the viewpoint data changes. instead of just when a key is pressed.
>
>
> #X3D V3.0 utf8
> PROFILE Immersive
> META "filename" "SixViewpointTour4.x3dv"
> # [meta] reference: Web3D.org X3D Bindable-Nodes, Viewpoint:
> NavigationInfo {
> type ["EXAMINE" "ANY"]
> }
> Viewpoint {
> description "Front View "
> position 0 0 10
> orientation 0 1 0 0
> }
> Viewpoint {
> description "Rear View"
> position 0 0 -10
> orientation 0 1 0 3.14
> }
> Viewpoint {
> description "Top View"
> position 0 10 0
> orientation -1 0 0 1.57
> }
> Viewpoint {
> description "Bottom View"
> position 0 -10 0
> orientation 1 0 0 1.57
> }
> Viewpoint {
> description "Left View"
> position -10 0 0
> orientation 0 -1 0 1.57
> }
> Viewpoint {
> description "Right View"
> position 10 0 0
> orientation 0 1 0 1.57
> }
> DEF Tour Viewpoint {
> description "Tour Views"
> position 0 0 10
> orientation 0 1 0 0
> }
> Background {
> backUrl "textures/bgBack.jpg"
> leftUrl "textures/bgLeft.jpg"
> bottomUrl "textures/bgBot.jpg"
> frontUrl "textures/bgFront.jpg"
> rightUrl "textures/bgRight.jpg"
> topUrl "textures/bgTop.jpg"
> }
> DEF PROX_SENSOR ProximitySensor {
> center 0 0 0
> size 100 100 100
> }
> DEF TRANS0 Transform {
> children [
> Transform { translation -8 5 -20
> children [
> Shape {
> appearance Appearance {
> material Material {
> diffuseColor 0 0 0 specularColor 0 0 0
> ambientIntensity 1.0 shininess 1.0 emissiveColor 0 0 0
> }
> }
> geometry DEF TYPESTRING0 Text {
> string [ "The First Viewpoint is the default Viewpoint
> Position and Orientation."
> "Box is at 0 0 0 with textures that name the
> Front (gaze +z) and other surfaces"
> "Backgroung elements are labelled according to
> the Specification"
> "Select From Six typical Viewpoints and a Tour."
> "Current Viewpoint Position ( x y z )"
> "and Orientation ( x y z angle) Shown Below:"]
> fontStyle FontStyle { style "BOLD" }
> }
> }
> ]
> }
> Transform { translation -3.5 -2.50 -10
> children [
> Shape {
> appearance Appearance {
> material Material {
> diffuseColor 0 0 0 specularColor 0 0 0
> ambientIntensity 0.0 shininess 0.0 emissiveColor 1 0 0 }
> }
> geometry DEF PositionString Text { string [ "Position"]
> fontStyle FontStyle { style "BOLD" }
> }
> }
> Transform { translation -0.75 -0.75 0
> children [
> Shape {
> appearance Appearance {
> material Material {
> diffuseColor 0 0 0 specularColor 0 0 0
> ambientIntensity 0.0 shininess 0.0 emissiveColor 1 0 0
> }
> }
> geometry DEF OrientationString Text { string [
> "Orientation" ]
> fontStyle FontStyle { style "BOLD" }
> }
> }
> ]
> }
> ]
> }
> ]
> }
> DEF PositionData Script {
> outputOnly MFString position
> inputOnly SFVec3f printPosition
> initializeOnly SFString sep ", "
> url "ecmascript:
> function printPosition (value,ts) {
> var viewPos = new SFVec3f;
> viewPos = value;
> var x = Math.round(viewPos.x*100)/100; // simple 2 decimal digits
> var y = Math.round(viewPos.y*100)/100;
> var z = Math.round(viewPos.z*100)/100;
> position = new MFString ( x + sep + y + sep + z );
> }
> "
> }
> DEF OrientationData Script {
> outputOnly MFString orientation
> inputOnly SFRotation printOrientation
> initializeOnly SFString sep ", "
> url "ecmascript:
> function printOrientation (value,ts) {
> var x = Math.round(value.x*100)/100;
> var y = Math.round(value.y*100)/100;
> var z = Math.round(value.z*100)/100;
> var angle = Math.round(value.angle*100)/100;
> orientation = new MFString ( x + sep + y + sep + z + sep + angle );
> }
> "
> }
>
> ROUTE PROX_SENSOR.position_changed TO PositionData.printPosition
> ROUTE PROX_SENSOR.orientation_changed TO OrientationData.printOrientation
>
> ROUTE PositionData.position TO PositionString.string
> ROUTE OrientationData.orientation TO OrientationString.string
>
> ROUTE PROX_SENSOR.position_changed TO TRANS0.set_translation
> ROUTE PROX_SENSOR.orientation_changed TO TRANS0.set_rotation
>
> # Box
> DEF boxfront Shape {
> appearance Appearance {
> material Material { }
> texture ImageTexture {
> url [ "textures/boxfront.jpg" ]
> }
> }
> geometry IndexedFaceSet {
> coordIndex [ 0 1 2 3 -1 ]
> coord Coordinate {
> point [ -1 -1 1, 1 -1 1, 1 1 1, -1 1 1 ]
> }
> texCoordIndex [ 0 1 2 3 -1 ]
> texCoord TextureCoordinate {
> point [ 0 0 1 0 1 1 0 1 ]
> }
> }
> }
> DEF boxright Shape {
> appearance Appearance {
> material Material { }
> texture ImageTexture {
> url [ "textures/boxright.jpg" ]
> }
> }
> geometry IndexedFaceSet {
> coordIndex [ 0 1 2 3 -1 ]
> coord Coordinate {
> point [ 1 -1 1, 1 -1 -1, 1 1 -1, 1 1 1 ]
> }
> texCoordIndex [ 0 1 2 3 -1 ]
> texCoord TextureCoordinate {
> point [ 0 0 1 0 1 1 0 1 ]
> }
> }
> }
> DEF boxrear Shape {
> appearance Appearance {
> material Material { }
> texture ImageTexture {
> url [ "textures/boxrear.jpg" ]
> }
> }
> geometry IndexedFaceSet {
> coordIndex [ 0 1 2 3 -1 ]
> coord Coordinate {
> point [ 1 -1 -1, -1 -1 -1, -1 1 -1, 1 1 -1 ]
> }
> texCoordIndex [ 0 1 2 3 -1 ]
> texCoord TextureCoordinate {
> point [ 0 0 1 0 1 1 0 1 ]
> }
> }
> }
> DEF boxleft Shape {
> appearance Appearance {
> material Material { }
> texture ImageTexture {
> url [ "textures/boxleft.jpg" ]
> }
> }
> geometry IndexedFaceSet {
> coordIndex [ 0 1 2 3 -1 ]
> coord Coordinate {
> point [ -1 -1 1, -1 1 1, -1 1 -1, -1 -1 -1 ]
> }
> texCoordIndex [ 1 2 3 0 -1 ]
> texCoord TextureCoordinate {
> point [ 0 0 1 0 1 1 0 1 ]
> }
> }
> }
> DEF boxtop Shape {
> appearance Appearance {
> material Material { }
> texture ImageTexture {
> url [ "textures/boxtop.jpg" ]
> }
> }
> geometry IndexedFaceSet {
> coordIndex [ 0 1 2 3 -1 ]
> coord Coordinate {
> point [ -1 1 1, 1 1 1, 1 1 -1, -1 1 -1 ]
> }
> texCoordIndex [ 0 1 2 3 -1 ]
> texCoord TextureCoordinate {
> point [ 0 0 1 0 1 1 0 1 ]
> }
> }
> }
> DEF boxbottom Shape {
> appearance Appearance {
> material Material { }
> texture ImageTexture {
> url [ "textures/boxbottom.jpg" ]
> }
> }
> geometry IndexedFaceSet {
> coordIndex [ 0 1 2 3 -1 ]
> coord Coordinate {
> point [ -1 -1 -1, 1 -1 -1, 1 -1 1, -1 -1 1 ]
> }
> texCoordIndex [ 0 1 2 3 -1 ]
> texCoord TextureCoordinate {
> point [ 0 0 1 0 1 1 0 1 ]
> }
> }
> }
>
> DEF TourTime TimeSensor { cycleInterval 66 loop TRUE }
>
> DEF TourPosition PositionInterpolator {
> key [ 0.0 0.125 0.25 0.378 0.5 0.625 0.75 0.875 1.0 ]
> keyValue [ 0 0 10, -10 0 0, 0 0 -10, 10 0 0, 0 0 10, 0 10 0,
> 0 0 10, 0 -10 0, 0 0 10 ]}
>
> DEF TourOrientation OrientationInterpolator {
> key [ 0.0 0.125 0.25 0.378 0.5 0.625 0.75 0.875 1.0 ]
> keyValue [ 0 1 0 0, 0 -1 0 1.57, 0 1 0 3.14, 0 1 0 1.57,
> 0 1 0 0, -1 0 0 1.57, 0 1 0 0, 1 0 0 1.57, 0 1 0 0 ]}
>
> ROUTE TourTime.fraction_changed TO TourOrientation.set_fraction
> ROUTE TourOrientation.value_changed TO Tour.orientation
> ROUTE TourTime.fraction_changed TO TourPosition.set_fraction
> ROUTE TourPosition.value_changed TO Tour.position
>
> Good Luck,
> Joe
>
>
> ----- Original Message ----- From: "Dark Before Dawn"
> <dark.before.dawn at gmail.com>
> To: "Joe D Williams" <joedwil at earthlink.net>
> Cc: <x3d-public at web3d.org>
> Sent: Friday, May 13, 2011 6:20 AM
> Subject: Re: [X3D-Public] X3DOM: Proximity Sensor
>
>
>> Hi Joe!
>> Thats right, it is possible to define own navigation methods and you
>> can also apply mouse rotations via JavaScript to ViewPoints.
>> But it conflicts with x3d/x3dom navigation mode "Examine". You can
>> rotate/drag the whole world around and the external positions and
>> rotations are never updated. It is a nice workaround, but i would
>> suggest to implement something similiar to X3D's ProximitySensor in
>> future versions.
>>
>> Cheers
>> Darky
>>
>> Am 13.05.2011 00:07, schrieb Joe D Williams:
>>> If the keys and clicks are getting handled, then great.
>>>
>>> how about?
>>> since for every key:
>>> var tmp = ((document.getElementById('vp'))...
>>> then, for example, maybe in the cases:
>>> tmp.position="' + 't_pos_x + ' ' + t_pos_y + ' ' + (t_pos_z-speed)'";
>>> break; ...
>>>
>>> Otherwise, since this could get complicated with collision and all,
>>> I would still say to prototype this in X3D because it may be easier
>>> if you need to touch and connect stuff and when multiple changes
>>> need to occur. Since Instant is so close, I bet this would also work
>>> very well using all X3D nodes and events and the scripting is more
>>> simple.
>>>
>>> Meanwhile, I am reading x3dom.js and wishing you very well for
>>> getting your example working with X3DOM.
>>>
>>> After the scripts at the beginning, the xmlized x3d looks very
>>> friendly and if the DOM key events and onclicks are that easy to
>>> handle then all the more fun.
>>>
>>> Best Regards,
>>> Joe
>>>
>>>
>>>
>>>
>>> ----- Original Message ----- From: "Dark Before Dawn"
>>> <dark.before.dawn at gmail.com>
>>> To: <x3d-public at web3d.org>
>>> Sent: Tuesday, May 10, 2011 9:06 AM
>>> Subject: [X3D-Public] X3DOM: Proximity Sensor
>>>
>>>
>>>> Hello :)
>>>> is there any way to read out camera position and orientation via
>>>> JavaScript? It seems there is no ProximitySensor or equivalent in
>>>> X3DOM.
>>>>
>>>> I tried to update the viewport node via JavaScript and keydown
>>>> Events
>>>> manualy. This kinda works, but there are also some disadvantages
>>>> like
>>>> manual collission detection.
>>>>
>>>> Thanks in advance :)
>>>> Cheers
>>>> Darky
>>>>
>>>> Code Snippet:
>>>>
>>>> <html>
>>>> <head>
>>>> <script
>>>> type='text/javascript'src='http://www.x3dom.org/x3dom/release/x3dom.js
>>>> <view-source:http://www.x3dom.org/x3dom/release/x3dom.js>'></script>
>>>> <link
>>>> rel="stylesheet"type="text/css"href="http://www.x3dom.org/x3dom/release/x3dom.css
>>>>
>>>> <view-source:http://www.x3dom.org/x3dom/release/x3dom.css>"/>
>>>>
>>>> <script type='text/javascript'>
>>>> document.onkeydown = handleKeys;
>>>>
>>>> function handleKeys(e)
>>>> {
>>>> var key = (window.event) ? event.keyCode : e.keyCode;
>>>>
>>>> var tmp =
>>>> ((document.getElementById('vp')).getAttribute('position')).split('
>>>> ', 3);
>>>> var t_pos_x = parseFloat(tmp[0]);
>>>> var t_pos_y = parseFloat(tmp[1]);
>>>> var t_pos_z = parseFloat(tmp[2]);
>>>>
>>>> var speed = 0.5;
>>>>
>>>> switch(key) // custom movement :)
>>>> {
>>>> case 38:
>>>> document.getElementById('vp').setAttribute('position', '' +
>>>> t_pos_x + ' ' + t_pos_y + ' ' + (t_pos_z-speed));
>>>> break;
>>>>
>>>> case 40:
>>>> document.getElementById('vp').setAttribute('position', '' +
>>>> t_pos_x + ' ' + t_pos_y + ' ' + (t_pos_z+speed));
>>>> break;
>>>>
>>>> case 39:
>>>> document.getElementById('vp').setAttribute('position', '' +
>>>> (t_pos_x+speed) + ' ' + t_pos_y + ' ' + t_pos_z);
>>>> break;
>>>>
>>>> case 37:
>>>> document.getElementById('vp').setAttribute('position', '' +
>>>> (t_pos_x-speed) + ' ' + t_pos_y + ' ' + t_pos_z);
>>>> break;
>>>> }
>>>> updatePositionInfoLabel();
>>>> }
>>>> </script>
>>>>
>>>> <script type="text/javascript">
>>>>
>>>> var pos_x = 0.0;
>>>> var pos_y = 0.0;
>>>> var pos_z = 0.0;
>>>>
>>>> function updatePositionInfoLabel()
>>>> {
>>>> var tmp =
>>>> ((document.getElementById('vp')).getAttribute('position')).split('', 3);
>>>>
>>>> pos_x = tmp[0];
>>>> pos_y = tmp[1];
>>>> pos_z = tmp[2];
>>>> document.getElementById('movement').innerHTML = 'Pos: ' + pos_x + '
>>>> ' + pos_y + ' ' + pos_z;
>>>> }
>>>> </script>
>>>> </head>
>>>> <body>
>>>> <x3d id='xdoc_1'width='400px'height='400px'>
>>>>
>>>> <scene>
>>>> <navigationInfo type='"examine" "any"'></navigationInfo>
>>>> <viewpoint id='vp'position='0 0 5'></viewpoint>
>>>> <transform id='s_cone1'scale='0.2 0.2 0.2'center='0 0
>>>> 0'onclick='updatePositionInfoLabel();'>
>>>> <shape>
>>>> <appearance >
>>>> <material id='dc_yellow'diffuseColor='yellow'></material>
>>>> </appearance >
>>>> <cone/>
>>>>
>>>> </shape>
>>>> </transform>
>>>> </scene>
>>>> </x3d>
>>>> <label id="movement">Movement</label>
>>>> </body>
>>>> </html>
>>>>
>>>>
>>>>
>>>
>>>
>>> --------------------------------------------------------------------------------
>>>
>>>
>>>
>
>
More information about the X3D-Public
mailing list