Skip to main content
thrinath12-Amethyst
12-Amethyst
March 23, 2019
Solved

how to write coding in Java script for display the time in Vuforia studio ?

I am trying to write coding in Java script to show different country time in vuforia studio for Thing mark .

Is any body know the coding can you share with me.

RolandRaytchevAnswer
21-Topaz I
March 27, 2019

Hi @thrinath,

so far I see the answer of @whity and @dupatel here is meant an simple app parameter as container of the value.

2019-03-27_10-48-34.gif

So this parameter is not related to any display of thingmark. So far I know you can not attach parameters on the thingmark. You can bind the e.g. date parameter to any 2d or 3d widges where you can see the value of this parameter.

so the code suggested by @whity  and addting some thing :

var timerId= setInterval(function(){$scope.showTime()},1500,true)

so to call the function every 1.5 seconds and to update the value of the date parameter. So this will update the valule of the date parameter with the current time and via the binding it will update the value of e.g. 3d label and 2d label as shown in the picture below:

2019-03-27_11-15-23.gif

2019-03-27_11-16-41.gif

So we can see in preview mode the time info as 2d and 3d label

But so far I know this will work first if the view (here Home)is  loaded-> means after scaning of the thingmark

View in thread

8 replies

dupatel5-Regular Member
5-Regular Member
March 25, 2019

@thrinath  You can use the default Javascript method to display date timezone. Sample JS code could be like below to show US timezone. You can also refer different date time methods in JS as per your needs.

$scope.app.params['date'] = new Date().toLocaleString("en-US", {timeZone: "America/New_York"});

 

-Durgesh

Translate
thrinath12-AmethystAuthor
12-Amethyst
March 25, 2019

The code you given $scope.app.params['date'] = new Date().toLocaleString("en-US", {timeZone: "America/New_York"}); i copied and paste in Home.js but its not coming in preview  how to visualize this time zone on thing Mark we need to add the 3d label button or anything else 

Translate
dupatel5-Regular Member
5-Regular Member
March 25, 2019

@thrinath  Directly adding the sample  code will not work. I used the application parameter named 'date' and setting its value to US date timezone using the JS code. Also, you can bind any widget text property to this application parameter which should appear in Preview.

 

-Durgesh

Translate
whity16-Pearl
16-Pearl
March 26, 2019

If you want to have something like a clock, you can play with this code:

 

$scope.showTime = function() {
var date = new Date();
var h = date.getHours(); // 0 - 23
var m = date.getMinutes(); // 0 - 59
var s = date.getSeconds(); // 0 - 59
var session = "AM";

if(h == 0){
h = 12;
}

if(h > 12){
h = h - 12;
session = "PM";
}
h = (h < 10) ? "0" + h : h;
m = (m < 10) ? "0" + m : m;
s = (s < 10) ? "0" + s : s;
var time = h + ":" + m + ":" + s + " " + session;
$scope.app.params['date'] = time;

$timeout(function () {
$scope.showTime();
}, 500);
}
$scope.showTime();

 

You'll need an application parameter named 'date', like dupatel mentioned.

Translate
    thrinath12-AmethystAuthor
    12-Amethyst
    March 27, 2019

    Hi sir,

    where we need to add application parameter?

    Is there any example files regarding the date and time on thingmark  can you share it. 

    Translate
    RolandRaytchev21-Topaz IAnswer
    21-Topaz I
    March 27, 2019

    Hi @thrinath,

    so far I see the answer of @whity and @dupatel here is meant an simple app parameter as container of the value.

    2019-03-27_10-48-34.gif

    So this parameter is not related to any display of thingmark. So far I know you can not attach parameters on the thingmark. You can bind the e.g. date parameter to any 2d or 3d widges where you can see the value of this parameter.

    so the code suggested by @whity  and addting some thing :

    var timerId= setInterval(function(){$scope.showTime()},1500,true)

    so to call the function every 1.5 seconds and to update the value of the date parameter. So this will update the valule of the date parameter with the current time and via the binding it will update the value of e.g. 3d label and 2d label as shown in the picture below:

    2019-03-27_11-15-23.gif

    2019-03-27_11-16-41.gif

    So we can see in preview mode the time info as 2d and 3d label

    But so far I know this will work first if the view (here Home)is  loaded-> means after scaning of the thingmark

    Translate
    Terms & ConditionsAccessibility statement