Timestamps written as text box on video - DrawCanvas AddTextBox

[Søren HJ]

Hi Gonçalo

I'm wondering if there is a way to write timestamps from a camera directly onto a video - so that each timestamp is placed in a textbox on the corresponding frame of the video. 

I have tried to achieve this by using DrawCanvas and AddTextBox - but I can only get static text in the AddTextBox.  I hope you can help me solve this.

Best regards

Søren

[Gonçalo Lopes]

Hi Søren and welcome to the forums.

The only issue with your workflow is that there was no property selected in the PropertyMapping node going into AddTextbox. If you double-click on it and add the Text property to the list, it should work (you may have to add a Format node before to convert the number into a string).

However, often I separate visualization and online annotations from the rest of the processing workflow, to make the workflow cleaner, something like this:

This way you could even group the entire visualization workflow into its own group and then go on to process the video like normal.

Hope this helps.

--
You received this message because you are subscribed to the Google Groups "Bonsai Users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to bonsai-users...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/bonsai-users/291d1e97-ed0d-4113-98e1-0d685968b85f%40googlegroups.com.

[Søren HJ]

Hi Gonçalo

Thank you very much for the rapid reply and the help. It works like a charm now + I learned a little more about the publish subject and property mapping nodes as well.  

Best regards
Søren

On Sunday, 29 March 2020 16:32:00 UTC+2, goncaloclopes wrote:

Hi Søren and welcome to the forums.

The only issue with your workflow is that there was no property selected in the PropertyMapping node going into AddTextbox. If you double-click on it and add the Text property to the list, it should work (you may have to add a Format node before to convert the number into a string).

However, often I separate visualization and online annotations from the rest of the processing workflow, to make the workflow cleaner, something like this:

This way you could even group the entire visualization workflow into its own group and then go on to process the video like normal.

Hope this helps.

On Fri, 27 Mar 2020 at 15:46, Søren HJ <shj...@gmail.com> wrote:

Hi Gonçalo

I'm wondering if there is a way to write timestamps from a camera directly onto a video - so that each timestamp is placed in a textbox on the corresponding frame of the video. 

I have tried to achieve this by using DrawCanvas and AddTextBox - but I can only get static text in the AddTextBox.  I hope you can help me solve this.

Best regards

Søren

--
You received this message because you are subscribed to the Google Groups "Bonsai Users" group.

To unsubscribe from this group and stop receiving emails from it, send an email to bonsai...@googlegroups.com.

[Sarah P]

Hi Gonçalo,

Would you by chance have the bonsai code for your example? If so, could you post it? I'd like to try stamp the video frames with the timestamp as well.

Thank you!

Sarah

On Sunday, March 29, 2020 at 10:32:00 AM UTC-4, goncaloclopes wrote:

Hi Søren and welcome to the forums.

The only issue with your workflow is that there was no property selected in the PropertyMapping node going into AddTextbox. If you double-click on it and add the Text property to the list, it should work (you may have to add a Format node before to convert the number into a string).

However, often I separate visualization and online annotations from the rest of the processing workflow, to make the workflow cleaner, something like this:

This way you could even group the entire visualization workflow into its own group and then go on to process the video like normal.

Hope this helps.

On Fri, 27 Mar 2020 at 15:46, Søren HJ <shj...@gmail.com> wrote:

Hi Gonçalo

I'm wondering if there is a way to write timestamps from a camera directly onto a video - so that each timestamp is placed in a textbox on the corresponding frame of the video. 

I have tried to achieve this by using DrawCanvas and AddTextBox - but I can only get static text in the AddTextBox.  I hope you can help me solve this.

Best regards

Søren

--
You received this message because you are subscribed to the Google Groups "Bonsai Users" group.

To unsubscribe from this group and stop receiving emails from it, send an email to bonsai...@googlegroups.com.

[Sarah P]

Hi Gonçalo,

Which "Timestamp" module did you use? The only one I can find is the Combinator > Reactive > Timestamp. That one requires and input node.

Thank you!

Sarah

[Gonçalo Lopes]

Hi Sarah,

The Timestamp you are looking for is actually built inside the example itself, by using a PublishSubject node. Subject nodes are a way to define "variables" in Bonsai so you can name them however you want (in this case I gave it the slightly unfortunate name of Timestamp which is conflicting with the built-in operator, hence causing the confusion).

I didn't keep the code of this particular example, but I might redo it for a tutorial series. In the meantime it is probably a great exercise to try and rebuild it from the image.

Let me know if you run into any other issues!

To unsubscribe from this group and stop receiving emails from it, send an email to bonsai-users...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/bonsai-users/162e8d21-0d34-4a8b-bfdb-0ef5faa6041a%40googlegroups.com.

[Sarah P]

Hi Goncalo,

I was able to get the code working using Soren's method (on top, disabled). But I'm confused with some of the nodes on your code (bottom, enabled), so I cannot get it to work. I also have questions on both codes to make sure I'm understanding what the code is doing.

First, Soren's method (top, disabled):

- Is the pixel size of the image shown in AddImage (WxH = 640 x 480)? Can we change the pixel size of the image to whatever size we want? Originally, the pixel size of the image was set to 1920 x 1080.

- Could you explain what the Size, Image, and Format > Text nodes and what they are doing? Does the Size (PropertyMapping) node take the pixel size (WxH) from the Image node and set CreateCanvas pixel size to be the same? Does the Image(PropertyMapping) node take the image of each frame from the VideoCaptureDevice > Image node and add the frame of image onto the canvas? Does the Format > Text node add the timestamp text to the canvas?

- Is there a way to display the timestamp with the date+hh:mm:ss.ssss. Currently, it only displays date+hh:mm:ss.

Second, your method (bottom, enabled):

- Row 2: Did I select the correct Timestamp(SubscribeSubject) node? Where can I find the Size node?

- Row 3: Did I select the correct Timestamp(SubscribeSubject) node? Where can I find the Value node?

- Row 4: Did I select the correct Timestamp(SubscribeSubject) node? Where can I find your second Timestamp node? Where can I find the Format node?

Thank you for your help!

Best regards,

Sarah

To view this discussion on the web visit https://groups.google.com/d/msgid/bonsai-users/162e8d21-0d34-4a8b-bfdb-0ef5faa6041a%40googlegroups.com.

[Aaron Norris]

In case it might help you here is my workflow implementation for timestamped video.

Cheers,

Aaron

[Gonçalo Lopes]

Hi Sarah,

Re. your questions:

First, Soren's method (top, disabled):

- Is the pixel size of the image shown in AddImage (WxH = 640 x 480)? Can we change the pixel size of the image to whatever size we want? Originally, the pixel size of the image was set to 1920 x 1080.

The Destination rectangle property in AddImage indicates where the image should be placed in the Canvas. The purpose of this property is to allow you to compose several images on a single bigger canvas (e.g. for tiled display of multiple video streams). In general, if you leave it at the default of [0,0,0,0] the image will fill the whole canvas. The input image will indeed be resized to fit whatever size of the square you specify for the canvas. The rectangle should be strictly contained inside the canvas, and the units are all relative to the size of the canvas specified in CreateCanvas.

 

Does the Size (PropertyMapping) node take the pixel size (WxH) from the Image node and set CreateCanvas pixel size to be the same?

Yes

 

Does the Image(PropertyMapping) node take the image of each frame from the VideoCaptureDevice > Image node and add the frame of image onto the canvas?

Yes

 

Does the Format > Text node add the timestamp text to the canvas?

The Format node is a chance for you to Format the timestamp text before it is rendered onto the canvas. There is a syntax allowing you to control how exactly the components of the timestamp should be rendered. You can find more information here: https://docs.microsoft.com/en-us/dotnet/standard/base-types/custom-date-and-time-format-strings

 

- Is there a way to display the timestamp with the date+hh:mm:ss.ssss. Currently, it only displays date+hh:mm:ss.

For example in this case, you could set the Format property to {0:o} (round-trip time format)

Re. the bottom part of the workflow, I am attaching a fixed version. Mostly it was just mismatched names in the subject and property mappings. In general you will need to make sure the properties in these nodes are matching the names in the sources. The error messages should be generally helpful, but sometimes might be obscure, so feel free to ask here.

Also, double-click on the property mapping nodes so you can see where they are pointing to.

Hope this helps.

 

To unsubscribe from this group and stop receiving emails from it, send an email to bonsai-users...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/bonsai-users/417667aa-bde1-4adc-9542-a9c56d3f2a55%40googlegroups.com.

[Sarah P]

Hi Adam,

Thanks for your code! I tried to run it but got an error message saying VideoFeed is not found in the current build context. I switched it to CameraCapture and then got the same error message for TimestampedVideo (Subscribe Subject). For learning purposes, can you tell me how I should fix this?

Thank you!

Best regards,

Sarah

[Sarah P]

Hi Goncalo,

Thank you so much for your reply!

I am trying to combine two of the codes that you shared, but I'm having some trouble.

I am trying to CombineLatest and Concat 2 videos, and print the timestamp on each frame of the montage video. I am getting error messages with the MemberSelector (Value) and InputMapping(Size) nodes though. I think one of my confusions lies with whether the concatenated montage video occurs at the Concat node, and which nodes I need to reference in order to print the timestamp on each frame of the concatenated video.

I'm attaching the two codes that you posted, that I'm trying to combine.

Thank you!

Best regards,

Sarah

To view this discussion on the web visit https://groups.google.com/d/msgid/bonsai-users/417667aa-bde1-4adc-9542-a9c56d3f2a55%40googlegroups.com.

[Sarah P]

One more question.

I double-clicked on the property mapping nodes to see where they are pointing to. When I double-click on Text, I see the "Name: Text." When I double-click on Image, I see the "Name: Image." I'm not sure what you mean by what these property mapping nodes are pointing to. What are they pointing to?

Thank you!

Sarah

[Aaron Norris]

yes there are few unneeded parts there that are from the larger workflow I cut it from.  The TimestampedVideo (Subscribe Subject) is going the externalize filename property in the video writer and it can be deleted.

[Sarah P]

Hi Goncalo,

I was able to create a video montage from 2 cameras using CombineLatest and Concat. I was also able to stamp the timestamp on the video montage. However, I have two questions.

Is there a way to stamp the timestamp on either video, flexibly? Currently, the timestamp only shows up on the video for the 1st camera.

Also, in the code, I had to use two Timestamp nodes. By using two nodes, I think the timestamps saved in the CSV file may be slightly different from the timestamps showing on the video frames. Is there a way to use a single Timestamp node to achieve the final result?

Thank you!

Best regards,

Sarah

[Gonçalo Lopes]

Hi Sarah,

I think the difficulty here was indeed the use of multiple timestamps. I have cleaned up the file essentially deleting all the unused combinators and making sure there is only a single Timestamp and a single TakeUntil. This way all other downstream nodes should behave appropriately.

Note that I took apart the original timestamp, processed the image contents and recombined it again for the drawing operators, so that their code doesn't have to be modified in any way.

Hope this helps.

To unsubscribe from this group and stop receiving emails from it, send an email to bonsai-users...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/bonsai-users/652b75e2-4a70-4668-9525-57aa8fc044b3%40googlegroups.com.

[Sarah P]

Thank you, Goncalo! This is incredibly helpful and educational!

May I ask a few questions to make sure I understand how the code works?

- Zip: When I use Show Visualizer to look at the Object the node is carrying, it shows the parameters of the image and the timestamp. I assume Zip does not actually carry the image frame itself. If so, how does the following node, CombineTimestamp, access the image when the image was skipped in the Zip node?

- The description for CombineTimestamp says the node "converts a tuple of element and timestamp into a proper timestamped type." Based on this code, I can see that one of the "elements" can be video images. What other "elements" can be used with CombineTimestamp to produce a proper timestamped type?

- TakeUntil: It appears that CombineTimestamp and TakeUntil carry both the image and the timestamp so that the image and timestamp can be published by MakeTimestampImage. Am I correct to understand that CombineTimestamp and TakeUntil is replacing CameraCapture > Timestamp > MakeTimestampImage from the previous code?

- How does TakeUntil operate on a node (i.e., MakeTimestampImage) that comes after it? In general, when can a node operate on nodes that come after it?

- I have figured out that I can move the coordinate position of the stamped timestamp on the video by changing the property Origin of AddText.

Thank you!

Best regards,

Sarah

To view this discussion on the web visit https://groups.google.com/d/msgid/bonsai-users/652b75e2-4a70-4668-9525-57aa8fc044b3%40googlegroups.com.

[Sarah P]

Thank you, Adam!

The code makes sense now!

Sarah

[Gonçalo Lopes]

- Zip: When I use Show Visualizer to look at the Object the node is carrying, it shows the parameters of the image and the timestamp. I assume Zip does not actually carry the image frame itself. If so, how does the following node, CombineTimestamp, access the image when the image was skipped in the Zip node?

Zip does indeed carry the image frame itself (Zip will carry the values of whatever inputs you feed into it). CombineTimestamp simply takes the values from Zip and gives them meaningful names. There are other ways to do this, but that node remains for historical reasons.

 

- The description for CombineTimestamp says the node "converts a tuple of element and timestamp into a proper timestamped type." Based on this code, I can see that one of the "elements" can be video images. What other "elements" can be used with CombineTimestamp to produce a proper timestamped type?

Any element type can be combined to produce a timestamp. The only restriction is that the second element of the tuple must be a DateTimeOffset type (the timestamp).

 

- TakeUntil: It appears that CombineTimestamp and TakeUntil carry both the image and the timestamp so that the image and timestamp can be published by MakeTimestampImage. Am I correct to understand that CombineTimestamp and TakeUntil is replacing CameraCapture > Timestamp > MakeTimestampImage from the previous code?

Yes, this is mostly to avoid re-timestamping the image.

 

- How does TakeUntil operate on a node (i.e., MakeTimestampImage) that comes after it? In general, when can a node operate on nodes that come after it?

https://bonsai-rx.org/docs/operators/takeuntil  

 

- I have figured out that I can move the coordinate position of the stamped timestamp on the video by changing the property Origin of AddText.

Yes, these will allow you to control the positioning of the text in the final image.

 

To unsubscribe from this group and stop receiving emails from it, send an email to bonsai-users...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/bonsai-users/dd3d1e28-a67e-4e5f-b2cc-f88fbb091bfb%40googlegroups.com.

[Sarah P]

Thank you for all your answers!

Sarah

To view this discussion on the web visit https://groups.google.com/d/msgid/bonsai-users/dd3d1e28-a67e-4e5f-b2cc-f88fbb091bfb%40googlegroups.com.