Dev.Opera - Follow the standards, break the rulesDev.Opera - Follow the standards, break the rules

Login

Lost password?


graph.js

Summary

No overview generated for 'graph.js'


Class Summary
Graph  

/* 
 * Copyright (c) 2006, Opera Software ASA 
 * All rights reserved. 
 * Redistribution and use in source and binary forms, with or without 
 * modification, are permitted provided that the following conditions are met: 
 * 
 *     * Redistributions of source code must retain the above copyright 
 *       notice, this list of conditions and the following disclaimer. 
 *     * Redistributions in binary form must reproduce the above copyright 
 *       notice, this list of conditions and the following disclaimer in the 
 *       documentation and/or other materials provided with the distribution. 
 *     * Neither the name of Opera Software ASA nor the 
 *       names of its contributors may be used to endorse or promote products 
 *       derived from this software without specific prior written permission. 
 * 
 * THIS SOFTWARE IS PROVIDED BY OPERA SOFTWARE ASA AND CONTRIBUTORS ``AS IS'' AND ANY 
 * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED 
 * WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE 
 * DISCLAIMED. IN NO EVENT SHALL OPERA SOFTWARE ASA AND CONTRIBUTORS BE LIABLE FOR ANY 
 * DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES 
 * (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; 
 * LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND 
 * ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT 
 * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS 
 * SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. 
 */ 
 
/** 
 *	Graph class. 
 * 
 *	This class eases the creation and display of data 
 * 
 *	@author Mathieu HENRI, Opera Software ASA 
 *	@constructor 
 *	@version	1.1 
 */ 
function Graph() 
{ 
	/**	'untitled Graph' @type String */ 
	this.title			= 'untitled Graph'/**	the width of the graphs ( '480px' by default ) @type String */ 
	this.width			= '480px'/**	the height of the graphs ( '360px' by default ) @type String */ 
	this.height			= '360px'/**	the background limit colors ( '#ffcc99' by default ) @type String */ 
	this.bgColor		= '#ffcc99'/**	the foreground limit colors ( '#336600' by default ) @type String */ 
	this.fgColor		= '#336600'; 
 
 
	/**	'renderer_' use this prefix to name the renderer methods you add to the prototype @type String */ 
	var	rendererMethodPrefix	= 'renderer_'/** @type Array */ 
	var	labels					= []; 
	/** @type Array */ 
	var	dataSets				= []; 
	var	min; 
	var	max; 
 
 
	/** 
	 *	check if a variable is an Array. 
	 * 
	 *	@private 
	 *	@param	what	the variable to test 
	 *	@return	{Boolean} 
	 */ 
	function isArray( what ) 
	{ 
		return (typeof(what)=='object' && what.constructor==Array); 
	} 
 
	/** 
	 *	reset the graph. 
	 * 
	 *	@private 
	 */ 
	function reset() 
	{ 
		labels			= []; 
		dataSets		= []; 
		min = undefined; 
		max = undefined; 
	} 
 
	/** 
	 *	set the labels. 
	 *	This will reset the entire Graph if there is not as many labels as before. 
	 * 
	 *	@param	{Array}	_labels	the array of {@link #labels} 
	 *	@return	{Boolean} 
	 *	@see	#getLabels 
	 *	@see	#reset 
	 */ 
	this.setLabels = function( _labels ) 
	{ 
		if( !isArray(_labels) ) 
			return false; 
 
		//	there was something in the dataSets for a different number of labels -> reset the graph. 
		//if( dataSets.length && dataSets[0].data.length!=_labels.length ) 
			reset(); 
 
		labels = _labels; 
		return true; 
	} 
 
	/** 
	 *	get the labels. 
	 * 
	 *	Especially meant to be used in the renderer methods. 
	 * 
	 *	@return	{Array}	the array of {@link #labels} 
	 *	@see	#setLabels 
	 */ 
	this.getLabels = function() 
	{ 
		return labels; 
	} 
 
	/** 
	 *	adds a set of data. 
	 *	The data set will be rejected if it does not have as many values as the labels of the Graph. 
	 * 
	 *	@param	{String}	_dataId		the id of the dataSet 
	 *	@param	{Array}		_dataSet	an array of numbers 
	 *	@param	{String}	_color		[OPTIONNAL] the color to use for this dataSet 
	 *	@return	{Boolean} 
	 *	@see	#getDataSets 
	 *	@see	#getDataRange 
	 */ 
	this.addDataSet = function( _dataId, _dataSet, _color ) 
	{ 
		if( !isArray(_dataSet) || _dataSet.length!=labels.length ) 
			return false; 
 
		for( var i=0; i<_dataSet.length; i++ ) 
			if( isNaN(_dataSet[i]) ) 
				return false; 
 
		max	= Math.max( max||-Infinity, Math.max.apply( Math, _dataSet ) ); 
		min	= Math.min( min||Infinity, Math.min.apply( Math, _dataSet ) ); 
 
		dataSets.push( typeof(_color)=='string'?{id:_dataId, data:_dataSet, color:_color }:{id:_dataId, data:_dataSet } ); 
		return true; 
	} 
 
	/** 
	 *	get the labels. 
	 * 
	 *	Especially meant to be used in the renderer methods. 
	 * 
	 *	@return	{Array}	the array of {@link #dataSets} 
	 *	@see	#addDataSet 
	 */ 
	this.getDataSets = function() 
	{ 
		return dataSets; 
	} 
 
	/** 
	 *	get the min/max range of the dataSets. 
	 * 
	 *	Especially meant to be used in the renderer methods. 
	 * 
	 *	@return	{Object}	an object with the minimum and maximum properties, or NULL 
	 *	@see	#addDataSet 
	 */ 
	this.getDataRange = function() 
	{ 
		if( dataSets.length ) 
			return {minimum:min,maximum:max}; 
 
		return null; 
	} 
 
	/** 
	 *	get the color of a given dataSet or a stable pseudo random color in the [ {@link #bgColor} ; {@link #fgColor} ] range. 
	 * 
	 *	Especially meant to be used in the renderer methods. 
	 * 
	 *	@param	{Number}	index	the index of the dataSet 
	 *	@return 			false if the index is invalid or a color {String} 
	 */ 
	this.getDataSetColor = function( index ) 
	{ 
		if( isNaN(index) || index<0 || !dataSets[index]  ) 
			return false; 
 
		if( this.colorList==undefined ) 
		{ 
			this.colorList = []; 
			this.colorList[ -1 ] = { seed:	0x01337 } 
		} 
 
		if( !this.colorList[ index ] ) 
		{ 
			var currentSeed = this.colorList[ this.colorList.length-1 ].seed; 
			for( var i=this.colorList.length; i<=index; i++ ) 
			{ 
				if( !dataSets[i].color ) 
			{ 
					currentSeed *= 1337; 
					currentSeed = (currentSeed&0x0aaaa>>1)+(currentSeed&0x05555<<1); 
					var rnd255 = (currentSeed&255)/255; 
					this.colorList.push( {seed:currentSeed, color:'#'+ (''+( Math.round(this.colorObjBg.b+this.colorObjDelta.b*rnd255) + 256*Math.round(this.colorObjBg.g+this.colorObjDelta.g*rnd255) + 65536*Math.round(this.colorObjBg.r+this.colorObjDelta.r*rnd255) ).toString(16)).slice(-6) } ); 
				} 
				else 
					this.colorList.push( {seed:currentSeed, color:dataSets[i].color } ); 
			} 
		} 
 
		return this.colorList[index].color; 
	} 
 
 
	/** 
	 *	list the renderers. 
	 * 
	 *	@return	{Array}	an array with the name of the renderer methods ( without the {@link #rendererMethodPrefix} ) 
	 */ 
	this.listStyles = function() 
	{ 
		var renderers = []; 
		for( var key in thisif( key.substr(0,rendererMethodPrefix.length)==rendererMethodPrefix && typeof(this[key])=='function' ) 
				renderers.push( key.substr(rendererMethodPrefix.length) ); 
 
		return renderers; 
	} 
 
	/** 
	 *	render the graph 
	 * 
	 *	@param	{String}		_style			the renderer to use 
	 *	@param	{HTMLElement}	_renderTarget	[OPTIONNAL] the HTMLElement where the graph must be rendered, document.body by default 
	 *	@return	{Boolean} 
	 */ 
	this.render = function( _style, _renderTarget ) 
	{ 
		if( typeof(_style)!='string' || !_style.length || !dataSets.length ) 
			return false; 
 
		var	graphRendererId	= rendererMethodPrefix+_style; 
		if( typeof(this[graphRendererId])!='function'return false; 
 
		var SVG			= createSVGElement 
			( 
				'svg', 
				{ 
					width:this.width, 
					height:this.height, 
					xmlns:'http://www.w3.org/2000/svg', 
					viewBox:'0 0 '+ parseFloat(this.width) +' '+ parseFloat(this.height) 
				} 
			) 
 
		//	init random color range 
		var c1 = parseInt( this.bgColor.substr( 1 ), 16 ), 
			c2 = parseInt( this.fgColor.substr( 1 ), 16 ); 
 
		this.colorObjBg		= { r:c1>>16, g:c1>>8&255, b:c1&255 }; 
		this.colorObjDelta	= { r:(c2>>16)-this.colorObjBg.r, g:(c2>>8&255)-this.colorObjBg.g, b:(c2&255)-this.colorObjBg.b }; 
 
		//	render 
		var renderState = this[graphRendererId]( SVG ); 
 
		delete this.colorList; 
		delete this.colorObjBg; 
		delete this.colorObjDelta; 
 
		if( renderState ) 
			(_renderTarget||document.body).appendChild( SVG ); 
 
		return renderState; 
	} 
 
	return this; 
} 
 
 
/** 
 *	create an SVGElement with some attributes. 
 * 
 *	This method is meant to ease the rendering of the graphs 
 * 
 *	@param	nodeName	{String} the name of the SVGElement to create 
 *	@param	attributesList	{Object} [OPTIONAL] a dictionnary of attributes 
 *	@return	{Boolean} 
 */ 
window.createSVGElement = function( nodeName, attributesList ) 
{ 
	var svgElement = document.createElementNS( 'http://www.w3.org/2000/svg', nodeName ); 
	if( attributesList!=undefined ) 
		for( var key in attributesList ) 
			if( typeof(key)=='string' ) 
				svgElement.setAttribute( key, attributesList[key] ); 
 
	return svgElement; 
} 


Documentation generated by JSDoc on Tue Oct 24 12:57:37 2006

Libraries