UPDATE 2-Oct-08: Deep Zoom Tag Cloud example updated for RC0
One of the Deep Zoom Composer team recently posted a Filtering by Tag Sample that takes advantage of the new "Tag" input in the latest Deep Zoom Composer release.
Kirupa says specifically "A major limitation in the current version is that if you have multiple tags separated by commas, the application doesn’t break them up and allow you to filter by them.That means, your images can only have one tag associated with them. Don’t worry – I will fix that shortly"...
Turns out you can enable multiple tags with relatively few changes to the example code (and a bit of inspiration from Kosta's Tag Cloud example).
The result looks like this (click to view larger image; notice the tags are scaled according to frequency), or try it here (beta2) (or RC0. The Metadata.xml shows how the source data looks.
The only changes to Kirupa's sample were in the
xmlClient_DownloadStringCompleted handler, which is called when the Metadata.xml has been retrieved. To try out the multiple-tag-"cloud" you should follow his instructions to get it running, then update xmlClient_DownloadStringCompleted with this code. Don't forget to seperate your tags with commas or semicolons!The major changes to enable multiple tags were:
1. split and trim the tag string/s
2. use the
uniqueTags Dictionary to store the 'count' of tag occurances
3. loop through all the tags to build a unique list, rather than assume just one is attached to the image
4. 'hardcode' the relative font sizes
There are many areas where this code to be improved - the tag handling is case sensitive (so "monastery" and "Monastery" would be listed seperately), the font size could be calculated (logarithmically?) rather than hardcoded , the tag-list could be more 'cloud like' rather than being hosted in a
ListBox and much more. They may be addressed in future posts... or attempted by the reader.
That is really cool Craig :)
ReplyDeleteBecause WebClient has a dependency on a web server running, the version I wrote won't be added as a project template into Deep Zoom Composer directly in our upcoming release, but I will make sure users know how to make the tag functionality more useful.
Cheers!
Kirupa
Just uploaded some code that extracts metadata from images outside of DZC, and then display both tags and description. I'm sure you guys have thought about that for Composer...
ReplyDeleteWe certainly have! Properly supporting tagging would require extra UI work to do well, and we wanted to keep our 1.0 release fairly simple.
ReplyDeleteWe have internal prototypes where the tagging functionality supports title, description, and keywords, and we may decide to add that in at a later version.
:)
It'd be a shame if the first release isn't as full-featured as it could be... JSON would get around the WebClient problem? (and makes xmlClient_DownloadStringCompleted neater/more strongly typed than the Linq/XDocument approach (IMO :)
ReplyDeleteI realize that this post has been inanactive for some time but I have been looking at this project to try get a feel for how DeepZoom can interact with other elements of the page.
ReplyDeleteI am wondering about something. Kirupa's example and source show the tags in a list form where the example here show a more traditional cloud, yet editing Kirupa's source with your suggested edits to allow for multiple tags per image does not produce the 'cloud' effect, nor fields that are updated to display an image's metadata on mouseOver.
Where could I get a look at that source?
It was a while ago, so I can't remember exactly... but there are two files to download on the follow-up to this post: page.xaml and page.xaml.cs.
ReplyDeleteI honestly couldn't tell you for sure that it's all there - but I *think* it is...
Mark, not sure whether you still need it, but I stumbled across the TagCloud project today. I haven't cleaned it up at all, but it ran OK for me. The source is downloadable from http://www.deepzoompublisher.com/TagUpdater/DeepZoomTagCloud_v0.5.zip
ReplyDeleteThings to note:
* It's intended to be used with TagUpdater (code is included)
* It takes parameters for DZC and Metadata in <OBJECT><PARAM> elements - see the included html file
* There is additional code in the solution that isn't used (ie. the stuff that does JSON parsing isn't all wired up)
Hope that helps.