Start a new topic

change Marker POI with HTML

Hello 
i have implemented Wikitude with Ionic 3 and i am interesting with POI example and it's work pretty fine
but i dont know how to customizing the marker from image to an element HTML


Hello Abdelkader,

Although we strongly recommend to use other types of augmentations, as the HTMLDrawables might behave differently on different devices (so there is no guarantee that the augmentation is looking or behaving the same on different devices), please have a look at the example here to see how you can work with them.

Thanks
Eva

 

i have try it the code proposed with the doc 
i declare a new instance of HTMLDrawble like this

var htmlDrawable = new AR.HtmlDrawable({html:"<div>My div</div>"}, 1, {
  translate : { x: 1 },
  onClick : function() {
    htmlDrawable.html += "<div>Another div</div>";
  },
  horizontalAnchor : AR.CONST.HORIZONTAL_ANCHOR.LEFT,
  opacity : 0.9 

})  

and i sign it to 

 

 

    //World.markerDrawable_idle = new AR.ImageResource("assets/marker_idle.png"); <--- this is the old marker proposed by  wikitude
    World.markerDrawable_idle = htmlDrawable; // i change it with htmlDrawble 

 when i try to do this i have an error (trying to find out where you are) 

PS : when i try to inspect my code with chrome inspector  i get the div with the content "my Div" indside another WebView

Hi,

This indicates that your location cannot be fetched as needed. If you search the forum then you will find numerous posts with all relevant information on how to solve this issue.
https://support.wikitude.com/support/search?term=trying+to+find+out+where+you+are&authenticity_token=Lw4LAwVzX0%2FnSqrKWNV20ZejjY5jn5sX%2F8t1RVX37c4%3D

 Please read the following resources as well:

Thanks

Eva

Login or Signup to post a comment