Recommended:

  • phpclasses.org
  • jsclasses.org
  • jsmag.com
  • siteapps.com
  • View our reviews on Hot Scripts
  • JS Tutorial
  • scripts.com
  • securesignup.com




Recent Comments

Powered by Disqus




Back to articles

Create avatar from user initials

Initial Avatar creates avatars for users from user initials. It creates a hash from the user's name and generates a background color based on it. Then it gets a complimentary color for the text, and calculates text size and position based on the font and length of initials. This package can output binary image data, or apply image to existing img element or create new img element

Package contains initialAvatar.js, initialAvatar.packed.js (packed javascript) and two example files: simple_example.html, example.html to demonstrate class functionality.

Contents

Download

Example codes

var av = new initialAvatar("Arturs Sosins");
var img = av.getImage();
document.body.appendChild(img);

Examples in action

Example scripts provided with package in action:

Method list

Constructor

Back to method list

Method namenew initialAvatar(name, config);
DescriptionCreate avatar instance with provided name and settings
Input parameters

name - full user name from which to take initials and hash for color

json config - Json structure with configuration properties

  • string font - name of the font to use (default: Arial)
  • number size - size of the dimension of image in pixels (default: 200)
Example input
var av = new initialAvatar("Arturs Sosins", 
{
	font: "Arial",
	size: 50
});

Get image data

Back to method list

Method namegetData()
DescriptionGet binary data of the image
Example
var av = new initialAvatar("Arturs Sosins");
document.getElementById("test").src = av.getData();

Apply to img element

Back to method list

Method nameapplyToImage()
DescriptionApply avatar src to existing img element
Input parameters

HTML element or string - provide HTML img element or string representing id of that element

Example
var av = new initialAvatar("Arturs Sosins");
av.applyToImage("avatar");

Get img element

Back to method list

Method namegetImage()
DescriptionGet img element with avatar
Example
var av = new initialAvatar("Arturs Sosins");
var img = av.getImage();
document.body.appendChild(img);

Latest changes

None for now

You may also be interested in:

Powered by BlogAlike.com

blog comments powered by Disqus