Skip to main content
1-Visitor
January 10, 2022
Solved

Difference between Preview Mode and Thingworx View

  • January 10, 2022
  • 1 reply
  • 3656 views

Hello,

 

My problem is that I have a difference between Preview Mode (where everything is working) and Thingworx View (where something is wrong). Also, my experience is in "Requires Authentification" access mode, so I don't think this is an accessibility issue.

 

The difference is on 3D Labels' classes. I display data in 3D Labels around a 3D Model and during the Model Loaded event I call 2 functions that change the 3D Labels' classes according to their value (to change their colour). On the Preview Mode this is working well, the 3D Labels' colour matches with their value as expected. But on Vuforia View the classes doesn't match their value, as if the functions that change the 3D Labels' classes weren't called, even if the 3D Model is loaded and the 3D Labels too (but with the wrong colour).

 

I also tried to call these functions with a button instead of the Model Loaded event, once again it worked with the Preview Mode, but not on Vuforia View.

 

If what I have done is working in Preview Mode then I can't see anything preventing it from working in Vuforia View, I am confused.

Does anyone have an idea that could fix this?

 


Thank you for the support.
Greetings

 

Sébastien

Best answer by SebastienV

@sgreywilson 

 

Hello,


I'm back now that I was able to test on Android and IOS devices.
Good news, the display of colors is done correctly, as in preview mode, so it seems that the problem is only due to whether or not the device supports CSS additions.


Thank you very much for the support regarding this issue.

1 reply

16-Pearl
January 10, 2022

@SebastienV 

 

I actually tried to use class and so far not got it to work in preview ! As there are not that many things you can change and I have a memory around setting classes on 3D labels may not work - possible bugs. Could you approach it differently say setting attributes that can be changed in UI for example

 

You many have already tried this 

 

$scope.setFontColor = function () {


$scope.view.wdg["3DLabel-2"].fontColor = "red";
$scope.view.wdg["3DLabel-1"].fontColor = "yellow";

}

 

Or tell me more what class attributes you are trying to set

 

 

 

16-Pearl
January 11, 2022

@SebastienV 

 

I did additional exploration and tried both preview and view on android mobile and had no issue (what is you device )

 

Attached anew project which sets the class (and now works)  and attributes. Can you see if this works for you

1-Visitor
January 11, 2022

Thank you for your reply.

 

It is uncanny, when I try your ColorCheck (first and 2nd version) it works both on Preview Mode and Vuforia View, but then if I apply the same commands on my project it only works on Preview Mode and still not on Vuforia View.
I am using the 92.4.921.0th version of Vuforia View on Windows 10 Entreprise, on a Dell Latitude 7200.

But soon I could try on a classic android device, do you think this could make a difference ?


So on my project I get the same result with the 2 methods, that I try to modify only the color of the 3D Label or its class, it will only work on Preview Mode. Here are my functions, called, as you do, with a Model Loaded event:

// to change the color

$scope.colorvolt = function() {
var voltage = $scope.view.wdg['valueDisplay-1']['value'];
if (voltage > 24) {
$scope.view.wdg["3DLabel-3"].fontColor = "#00AA00";
$scope.view.wdg["3DLabel-4"].fontColor = "#00AA00";
} else if (voltage < 23) {
$scope.view.wdg["3DLabel-3"].fontColor = "red";
$scope.view.wdg["3DLabel-4"].fontColor = "red";
} else if ((voltage < 24) && (voltage > 23)) {
$scope.view.wdg["3DLabel-3"].fontColor = "#DE7C00";
$scope.view.wdg["3DLabel-4"].fontColor = "#DE7C00";
}
};


$scope.colorstate = function() {
var state = $scope.view.wdg['3DLabel-2']['text'];
if ((state == "good") || (state == "default")) {
$scope.view.wdg["3DLabel-2"].fontColor = "#00AA00";
} else if (state == "charging") {
$scope.view.wdg["3DLabel-2"].fontColor = "#00FF00";
} else if (state == "error") {
$scope.view.wdg["3DLabel-2"].fontColor = "black";
}
};

____________________________________________________________
//OR
____________________________________________________________
// to change the class

$scope.colorvolt = function() {
var voltage = $scope.view.wdg['valueDisplay-1']['value'];
if (voltage > 24) {
$scope.view.wdg["3DLabel-3"].class = "label_Good";
$scope.view.wdg["3DLabel-4"].class = "label_Good";
} else if (voltage < 23) {
$scope.view.wdg["3DLabel-3"].class = "label_Dead";
$scope.view.wdg["3DLabel-4"].class = "label_Dead";
} else if ((voltage < 24) && (voltage > 23)) {
$scope.view.wdg["3DLabel-3"].class = "label_Warning";
$scope.view.wdg["3DLabel-4"].class = "label_Warning";
}
};


$scope.colorstate = function() {
var state = $scope.view.wdg['3DLabel-2']['text'];
if ((state == "good") || (state == "default")) {
$scope.view.wdg["3DLabel-2"].class = "label_Good";
} else if (state == "charging") {
$scope.view.wdg["3DLabel-2"].class = "label_Charging";
} else if (state == "error") {
$scope.view.wdg["3DLabel-2"].class = "label_Error";
}
};