Start a new topic

3D Model can't animate on Geo location


Based on sample 3d geo, I put 2 button (Play and Snap)

Snap is capture screen

Play is animate 3d model

Snap function is work. But animate can't. Can you help me?

Here the index.html :





    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

    <meta content="width=device-width,initial-scale=1,maximum-scale=5,user-scalable=yes" name="viewport">



    <link rel="stylesheet" href="jquery/" />

    <!-- required to set background transparent & enable "click through" -->

    <link rel="stylesheet" href="jquery/jquery-mobile-transparent-ui-overlay.css" />

    <script src="architect://architect.js"></script>

    <script type="text/javascript" src="../ade.js"></script>

    <script type = "text/javascript">

      function clic_camera()





     <script type="text/javascript" src="jquery/jquery-1.9.1.min.js"></script>

     <script type="text/javascript" src="jquery/"></script>



    <link rel="stylesheet" href="css/default.css">




    <div id="loadingMessage" class="info">Loading ...</div>

    <div class="camera_hdp" id="scanButtonWrapper">

        <a href="javascript: World.captureScreen();" onClick="clic_camera()" data-role="button" data-inline="true">SNAP</a>



    <div class="camera_hdp" id="scanButtonWrapper2">

        <a href="#" onClick="World.playScreen();" data-role="button" data-inline="true">PLAY</a>




    <script src="js/3dmodelatgeolocation.js"></script>



The 3dmodelatgeolocation.js ;

var World = {

 loaded: false,

 rotating: false,

 init: function initFn() {



 createModelAtLocation: function createModelAtLocationFn() {


   First a location where the model should be displayed will be defined. This location will be relativ to the user.


  var location = new AR.RelativeLocation(null, 5, 0, -2);




   Next the model object is loaded.


  var modelEarth = new AR.Model("assets/dragon.wt3", {

   onLoaded: this.worldLoaded,

   scale: {

    x: 2,

    y: 2,

    z: 2



        var indicatorImage = new AR.ImageResource("assets/indi.png");

        var indicatorDrawable = new AR.ImageDrawable(indicatorImage, 0.1, {

            verticalAnchor: AR.CONST.VERTICAL_ANCHOR.CENTER





   Putting it all together the location and 3D model is added to an AR.GeoObject.


  var obj = new AR.GeoObject(location, {

            drawables: {

               cam: [modelEarth],

               indicator: [indicatorDrawable]







 captureScreen: function captureScreenFn() {

       document.location = "architectsdk://button?action=captureScreen";



 playScreen: function playScreenFn() {


   var anim = new AR.ModelAnimation(World.modelEarth, "Animation_00");



 worldLoaded: function worldLoadedFn() {

  World.loaded = true;

  var e = document.getElementById('loadingMessage');





1 Comment

Hello Budi,

In order to have a better understanding of how the animation for 3D models on Geo location should work, I suggest you have a look at our following samples.



Login or Signup to post a comment