ig_markerfactory

IG MarkerFactory: uses a canvas element to create images on the fly, specially taylored for Google Maps API.

Uses canvas to dynamically generate marker images suitable for use with google maps. It renders nice looking badges in the front by combining overlaying text on top of canvas rendered background. Those text can be SVG images such as Font-Awesome, Fontello, etc.

Installation

Install it with jspm like so:

jspm install github:huasofoundries/ig_markerfactory

If you don't use jspm, you can as well clone this repo and copy dist/markerfactory.js to your project.

Usage

This is a simple example using AMD loading:

	define(['huasofoundries/ig_markerfactory'], function(MarkerFactory) {

		var myIcon = MarkerFactory.autoIcon({
			label: 'f1b9',
			font: 'fontawesome-webfont',
			color: '#CC0000',
			fontsize: 20
			});

		console.log(myIcon);

	});

The myIcon object is a valid google.maps.Icon object, but of course you might want the image for other purposes so you can just use myIcon.url which is a data URI

Examples:

	define(['huasofoundries/ig_markerfactory'], function(MarkerFactory) {

		var myIcon = MarkerFactory.autoIcon({
			label: 'f1b9',
			font: 'fontawesome-webfont',
			color: '#CC0000',
			fontsize: 20
			});

		console.log(myIcon);

	});

You'll see that myimage.url is a data url you can use as the SRC attribute of the image.