Wikitude
How can we help you today?
How to download the image in HtmlDrawable?
Wikitude Support
Hi,
Let me jump in here. Aitor already provided a lot of details on how you can draw the circle using InstantTrackables and which approach to use. I’d like to add details about our support process in general to manage your expectations. For questions such as the one we’re dealing in this thread, our approach is to give code snippets, descriptions and ideas on how to solve the problem, links to the Wikitude documentation and samples. Please note that we’re not providing 3rd party development and therefore are not providing any code or samples in addition to what we already offer online.
As the support is done by our core team to ensure a high quality support process, I hope you can understand that we need to work efficiently. Ideally you make sure that you fully understand the sample app, how it works and also seek for input in different support channels online (as the questions don’t seem to be related to an issue in the SDK directly but more to general development questions).
We're happy to recommend one of our premium partners, should you wish to work together with someone who is offering app development services.
Thx for your understanding and greetings
Nicola
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!
Wikitude Technical Support
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.
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?
Wikitude Technical Support
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.
I don't know whether I have attached the circle to the plane. How can I unattach it?
Wikitude Technical Support
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 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!
Wikitude Technical Support
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.
My project is in the attachment. Thanks in advance!
Wikitude Technical Support
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.
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.
Wikitude Support
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
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.
Wikitude Support
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
johmn ben
I want to download the image from HtmlDrawable, but I found it invalid.