CODEWITHSUNDEEP
javascriptimagetags
Daniel Silveira
Daniel Silveira

Reputation: 42553

Tag images in the image itself? HOW-TO

How to tag images in the image itself in a web page?

I know Taggify, but... is there other options?

Orkut also does it to tag people faces... How is it done?

Anyone knows any public framework that is able to do it?

See a sample bellow from Taggify:

alt text

Upvotes: 6

Views: 4895

Answers (4)

Xidobix
Xidobix

Reputation: 2638

I will re-activate this question and help a bit. Currently the only thing i have found about is http://www.sanisoft.com/downloads/imgnotes-0.2/example.html . A jQuery tagging implementation. If anyone knows about another way please tell us.

;)

Upvotes: 3

Steven Oxley
Steven Oxley

Reputation: 6724

There's a map tag in HTML that could be used in conjunction with Javascript to 'tag' different parts of an image.

You can see the details here.

Upvotes: 3

Rui Curado
Rui Curado

Reputation: 949

You can check out Image.InfoCards (IIC) at http://www.imageinfocards.com . With the IIC meta-data utilities you can add meta-data in very user-friendly groups called "cards".

The supplied utilities (including a Java applet) allow you to tag GIF's, JPEG's and PNG's without changing them visually.

IIC is presently proprietary but there are plans to make it an open protocol in Q1 2009.

The difference between IIC and others like IPTC/DIG35/DublinCore/etc is that it is much more consumer-centric and doesn't require a CS degree to understand and use it...

Upvotes: 1

Luke Foust
Luke Foust

Reputation: 2234

I know this isn't javascript but C# 3.0 has an API for doing this. The System.Windows.Media.Imaging namespace has a class called BitmapMetadata which can be used to read and write image metadata (which is stored in the image itself). Here is a method for retrieving the metadata for an image given a file path:

public static BitmapMetadata GetMetaData(string path)
{
    using (Stream s = new System.IO.FileStream(path, FileMode.Open, FileAccess.ReadWrite, FileShare.ReadWrite))
    {
        var decoder = BitmapDecoder.Create(s, BitmapCreateOptions.None, BitmapCacheOption.OnDemand);
        var frame = decoder.Frames.FirstOrDefault();
        if (frame != null)
        {
            return frame.Metadata as BitmapMetadata;
        }
        return null;
    }
}

The BitmapMetadata class has a property for tags as well as other common image metadata. To save metadata back to the image, you can use the InPlaceBitmapMetadataWriter Class.

Upvotes: 3

Related Questions