Start a new topic

How to download the image in HtmlDrawable?

I want to download the image from HtmlDrawable, but I found it invalid.


Hi,


Could you please provide further details:


  • Which version of the SDK are you using?
  • Are you working with the JS API or any of our extensions?
  • Share details on what exactly you mean by 'download the image from HTMLDrawable'


Thx and greetings

Nicola

I use the 9.0 version of the SDK.

I add canvas of the html in the application, then I can draw some pictures in it. Next, I put the base64 of the that pictures into HtmlDrawable in order to use InstantTrackable.But I found the HtmlDrawable rotated, I think download the picture in the canvas so that I can use the ImageDrawable to track.


Hi,


Thx for your feedback. It's still not entirely clear to me what you're trying to achieve. Is the only problem that the HTMLDrawable is rotated? Can you share screenshot(s) of the issue?


Thx and greetings

Nicola

First,I drew a circle in the canvas of html.(figure 1.jpg)

Second, I pressed the button to start the Instant Tracking. The javascript api I used is HtmlDrawable, InstantTrackable.The circle is showed in HtmlDrawable by base64 encoding.

Third,  I saw the circle rotate 90° when my phone is parallel to the ground, but it will show normally if my phone is perpendicular to the ground.(figure 2.jpg)


I want to the circle show normally whether my phone is vertical or parallel.

figure 2.jpg
(68.7 KB)
figure 1.jpg
(66.1 KB)

Hi,


I can't reproduce your issue, but for now my candidate is that you need to give a rotation to the drawable you are adding to the instantTrackable. Could you please tell me if giving a rotation to the HtmlDrawable works or not? If not, since I can't reproduce your issue, I would need you to send me your .html and your javascript files so I can have a better look at the problem. 

 

Regards,


Aitor.

My project is in the attachment. Thanks in advance!

zip

Hi, 


I could not reproduce your steps with the project you sent. I'm drawing a red circle, then I press the button to start the Instant Tracking and the circle is totally gone.


What do you mean with "show normally"? To show it always parallel to the plane you have tracked or to show it always parallel to the camera?


Regards,


Aitor.

I want the tracked object to be showed always parallel to the camera.But now the problem is that the tracked object will rotate. The reason why it will rotate is that my phone's camera is not parallel to the plane. When my phone's camera is parallel to the plane, it will not rotate that is what I mean with "show normally".


My aim is that the tracked object is always parallel to the camera however I tilt the phone,,so that I can see what I have mark on the object.


Thanks in advance! 

Hi,


I'm a bit confused with the terms you are using right now. What do you mean with tracked object? As far as I can see you are not using our Object Tracking feature,

but the Instant Tracking which should track a plane. Additionally, if you attach what you have drawn with the plane tracked, it is expected that the circle

is shown at some point rotated as it will be attached with a 3D position. 


What I would suggest is to not attach the circle to the plane and it will be shown always in front of the camera.


Regards,


Aitor.

I don't know whether I have attached the circle to the plane. How can I unattach it?

When calling World.instantTrackable.drawables.addCamDrawable(crossHairsBlueImage1); in the line 215 of your javascript file, you are attaching the crossHairsBlueImage1 as a drawable for the InstantTracker. This variable is an HtmlDrawable created in the line 194 which you are rotating -70 degrees. If you don't want the element you draw to be attached to the plane, just remove the addCamDrawable call and use the canvas in other way you want.


Regards,


Aitor. 

But I can't find any way to track the mark in the canvas except  this way? Which way can the mark we draw in the canvas fixed the arbitrarily physical environment?

If you want the circle you draw to be fixed in the plane you tracked, you are doing it correctly by attaching it to the InstantTrackable, but as the plane is in a 3D space, the circle will also have a 3D position and it always will be rotated at some point in your camera. The circle can't be parallel to the camera all the time if it is attached into a 3D position.


Regards,


Aitor.

If I want to achieve the goals that circle I draw will be fixed in the physical enviroment whatever I move the phone, which way should I use?


Thanks in advance! 

Login or Signup to post a comment