1

I am relatively new to JavaScript and I could use a little help understanding what is going on here. This is probably a simple question for those in the know. I am getting different values for an object's property based on how the output is requested.

(There is a probably more background information provided here than is needed but it is included for completeness.)

I am trying to use three.js ColladaLoader.js to read a Collada dae (XML) file into Firefox for display of geometry with coloring based on analytical data. The platform is windows 7.

ColladaLoader.js contains an object of type "Input" and I have an instance of an "Input" object called "tinput".

In an effort to try and understand the best way to to import my analytical data (see: https://collada.org/mediawiki/index.php/Extension) I placed the following line in ColladaLoader.js' Polygons.prototype.parse function.

console.log('>tinput:', tinput, ' >tinput.source:', tinput.source, ' >tinput["source"]:', tinput["source"]);

In this line I request the Firefox console to display the "tinput" object and then the object's "source" property using two different methods. This results in:

">tinput:" Object { semantic: "VERTEX", offset: 0, source: "XX", set: -1 } " >tinput.source:" "VV" " >tinput["source"]:" "VV"

Notice that the value of the "source" property is different when I print the object as a whole and when I print the "source" property directly.

The correct value of "source" found in the dae file is "VV": (Note: ColladaLoader.js strips off the pound sign). The XML tag is: 

<input source="#VV" semantic="VERTEX" offset="0"/>

NOTE: There is another dae XML entry in the file that looks like:

<input source="#XX" semantic="POSITION"/>

But it is not the line being parsed, though it looks like JavaScript is picking up the "XX" from here.

I wanted to see if anything else in the object acted this way so I wrote:

for( iii in tinput ) {
    console.log(' iii = ', iii, '    tinput[iii] = ', tinput[iii]);
}

which resulted in:

" iii = " "semantic" "    tinput[iii] = " "VERTEX" ColladaLoader.js:3210
" iii = " "offset" "    tinput[iii] = " 0 ColladaLoader.js:3210
" iii = " "source" "    tinput[iii] = " "VV" ColladaLoader.js:3210
" iii = " "set" "    tinput[iii] = " -1 ColladaLoader.js:3210
" iii = " "parse" "    tinput[iii] = " function () ColladaLoader.js:3210

Which indicates that only the "source" property is yielding different values based on how it is displayed.

I also tried:

console.log('>tinput.valueOf():', tinput.valueOf());

which yielded:

">tinput.valueOf():" Object { semantic: "VERTEX", offset: 0, source: "XX", set: -1 }

and:

console.log(' >tinput.source.valueOf():', tinput.source.valueOf(), '>tinput["source"].valueOf():', tinput["source"].valueOf());

which yielded:

" >tinput.source.valueOf():" "VV" " >tinput["source"].valueOf():" "VV"

Still showing the same discrepancy.

And I also tried:

console.log('tinput = ', JSON.stringify(tinput, null, 2) );

which resulted in:

"tinput = " "{
  "semantic": "VERTEX",
  "offset": 0,
  "source": "VV",
  "set": -1
}"

Which indicates the correct value of "source" ("VV").

This section of the dae XML file is in question given below with the long data fields truncated:

<source id="XX">
  <float_array count="16554" id="verts-points-array">26.47993 0.1520446 11.91956 26.42765 0.1342111 11.91947 (...) </float_array>
  <technique_common>
    <accessor count="5518" source="#verts-points-array" stride="3">
      <param type="float" name="X"/>
      <param type="float" name="Y"/>
      <param type="float" name="Z"/>
    </accessor>
  </technique_common>
</source>
<source id="analysis_data_source" name="per_vertex_results_data">
  <float_array count="16554" id="analysis-data-array">26.47993 0.1520446 11.91956 26.42765 0.1342111 11.91947 (...) </float_array>
  <technique_common>
    <accessor count="5518" source="#analysis-data-array" stride="3">
      <param type="float" name="P" semantic="PRESSURE" />
      <param type="float" name="T" semantic="TEMPERATURE"/>
      <param type="float" name="VM" semantic="VON_MISES_STRESS"/>
    </accessor>
  </technique_common>
</source>
<vertices id="VV">
  <input source="#XX" semantic="POSITION"/>
  <input source="#analysis_data_source" semantic="RESULTS"/>
</vertices>
<triangles count="2758" material="materialref">
  <input source="#VV" semantic="VERTEX" offset="0"/>
  <p>150 141 163 151 150 164 152 151 165 153 152 (...) </p>
</triangles>

The line being parsed when the discrepancy shows up is the "input" tag within the "triangles" tag. (The XML file validates fine.)

Could anyone please help me understand what is going on here? Why do I get different values depending on how I access the "source" parameter? (It may have nothing to do with all the Collada/XML stuff but I thought I should include it just in case it does.)

Thanks.

EDIT:

I re-read the post and I think I make it way to complicated:

THE SHORT VERSION:

Given:

console.log('tinput =', tinput);
console.log('tinput.source =', tinput.source);

Yeilds:

"tinput =" Object { semantic: "VERTEX", offset: 0, source: "XX", set: -1 }
"tinput.source =" "VV"

Why is the "source" property value not the same?

Sorry for wasting your time on the long post.

dannyt
  • 21
  • 3

1 Answers1

1

Well my ignorance is showing again. It looks like the problem stems from my not understanding how console.log works. It seems that console.log has some goofy behavior when you try to use it to display an object's property values. console.log will not display the value of the objects properties that exist when the console.log line is executed. Though the location in the output will be consistent with the location of the console.log call, the values reported will be those that exist in the object at the end of script execution. Here is a more complete description: console.log object at current state

Thanks.

Community
  • 1
  • 1
dannyt
  • 21
  • 3