function CustomMarker(opts) {
	this.latlng_ = opts.position;
	this.labeltext_ =  opts.text || "";
	this.img_ = opts.image;
	// Once the LatLng and text are set, add the overlay to the map.  This will
	// trigger a call to panes_changed which should in turn call draw.
	this.setMap(opts.map);
	this.labelclass = opts.labelclass || "";
	this.labelid = opts.labelid || "";
	this.offset = 0;
}

CustomMarker.prototype = new google.maps.OverlayView();

CustomMarker.prototype.draw = function() {
	var me = this;

	// Check if the div has been created.
	var div = this.div_;
	if (!div) {
		// Create a overlay text DIV
		div = this.div_ = document.createElement('DIV');
		// Create the DIV representing our CustomMarker
		div.style.border = "none";
		div.style.position = "absolute";
		div.style.paddingLeft = "0px";

		//var canvas = document.createElement("canvas");
		var canvas = this.canvas_ = document.createElement("canvas");
		//canvas.innerHTML = "<img src=/circle/blue>";
		var ctx = canvas.getContext('2d');
		var img = this.img_;
		this.offset = Math.round(img.width/2);
		canvas.setAttribute('width', img.width+1);
		canvas.setAttribute('height', img.height+1);
		ctx.save();
		if (img.complete)
		{
			ctx.drawImage(img,0,0);
		}
		else
		{
			img.onload = function () {ctx.drawImage(this,0,0);};
		}
		div.appendChild(canvas);
		var text = document.createElement('DIV');
		text.className += " map-labeltext";
		if (this.labelclass)
			text.className += " "+this.labelclass;
		text.innerHTML = this.labeltext_;
		div.appendChild(text);

		// Then add the overlay to the DOM
		var panes = this.getPanes();
		panes.overlayImage.appendChild(div);
	}

	// Position the overlay 
	var point = this.getProjection().fromLatLngToDivPixel(this.latlng_);
	if (point) {
		div.style.left = point.x - this.offset + 'px';
		div.style.top = point.y - this.offset + 'px';
	}
};

CustomMarker.prototype.remove = function() {
	// Check if the overlay was on the map and needs to be removed.
	if (this.div_) {
		this.div_.parentNode.removeChild(this.div_);
		this.div_ = null;
	}
};
CustomMarker.prototype.getVisible = function() {
	if (this.div_.style.display == 'none')
		return null;
	return 1;
};
CustomMarker.prototype.setVisible = function(visible) {
	if (!visible)
		this.div_.style.display = 'none';
	else
		this.div_.style.display = '';
};

CustomMarker.prototype.getPosition = function() {
	return this.latlng_;
};

CustomMarker.prototype.setPosition = function(latlng) {
	this.latlng_ = latlng;
	var div = this.div_;
	// Position the overlay 
	var point = this.getProjection().fromLatLngToDivPixel(this.latlng_);
	if (point) {
		div.style.left = point.x - this.offset + 'px';
		div.style.top = point.y- this.offset + 'px';
	}
	var ctx = this.canvas_.getContext('2d');
	
	ctx.clearRect(0,0, this.img_.width+1, this.img_.height+1);
	ctx.save();
	ctx.translate( this.offset , this.offset);

	if (this.latlng_ && this.latlng_.bearing)
	{
		ctx.rotate(this.latlng_.bearing * Math.PI/180);
	}
	ctx.translate(-1 * this.offset, this.offset * -1 );
	//ctx.drawImage(this.img_,-8,-8,17,17);
	ctx.drawImage(this.img_, 0,0);
	ctx.restore();

};


