File: ia\charts\layers\ComparisonPlotLayer.js
/**
* The base class for comparison plot layers.
*
* @author J Clare
* @class ia.ComparisonPlotLayer
* @extends ia.PlotLayer
* @constructor
*/
ia.ComparisonPlotLayer = function()
{
ia.ComparisonPlotLayer.baseConstructor.call(this);
this.style = {fillStyle:'#ffffff', strokeStyle:'#ff0000', lineWidth:'2', lineJoin:'round'};
this.displayAll = false;
this.isComparison = true;
};
ia.extend(ia.PlotLayer, ia.ComparisonPlotLayer);
/**
* The layer style.
*
* @property style
* @type Object
* @default {fillStyle:'#ffffff', strokeStyle:'#888888', lineWidth:'2', lineJoin:'round'}
*/
ia.ComparisonPlotLayer.prototype.style;
/**
* Should all data be displayed.
*
* @property displayAll
* @type Boolean
* @default false
*/
ia.ComparisonPlotLayer.prototype.displayAll;
/**
* Shortcut to avoid verbose code - referenced in ia.PlotLayer.
*
* @property isComparison
* @type Boolean
* @default true
*/
ia.ComparisonPlotLayer.prototype.isComparison;
/**
* Renders the data.
*
* @method render
*/
ia.ComparisonPlotLayer.prototype.render = function()
{
// Clear the canvas.
this.clear();
// Reset the context styles in case the layer styles has changed.
for (var p in this.style)
{
this.context[p] = this.style[p];
this.selectionContext[p] = this.style[p];
this.highlightContext[p] = this.style[p];
}
this.highlightContext.strokeStyle = this.highlightColor;
this.selectionContext.strokeStyle = this.selectionColor;
// Render the items.
var nItems = this.itemArray.length;
for (var i = 0; i < nItems; i++)
{
var chartItem = this.itemArray[i];
this._setItemShape(chartItem);
if (this.displayAll) this._renderItem(chartItem);
}
this.renderSelection();
};
/**
* Sets an items dimensions.
*
* @method _setItemShape
* @param {Object} item The item.
* @private
*/
ia.ComparisonPlotLayer.prototype._setItemShape = function(item)
{
// Calculate the bounding box of the chart item.
var x = this.map.getPixelX(item.xValue);
var y = this.map.getPixelY(item.yValue);
var w = 10;
var h = 10;
// Reset the pixel drawing area for the point.
item.shape.x = x;
item.shape.y = y;
item.shape.width = w;
item.shape.height = h;
// Reset the pixel hit area for the point.
w = Math.max(15, w);
h = Math.max(15, h);
if (ia.IS_TOUCH_DEVICE) // Larger hit area for touch devices.
{
w = Math.max(30, w);
h = Math.max(30, h);
}
item.hitArea.x = x - (w / 2);
item.hitArea.y = y - (h / 2);
item.hitArea.width = w;
item.hitArea.height = h;
};
/**
* Clears all selections.
*
* @method clearSelection
*/
ia.ComparisonPlotLayer.prototype.clearSelection = function() {};
/**
* Renders the item to the given context.
*
* @method _renderItem
* @param {Object} item The item.
* @private
*/
ia.ComparisonPlotLayer.prototype._renderItem = function(item)
{
this.context.strokeStyle = item.color;
this._drawItem(item, this.context);
};
/**
* Selects the item.
*
* @method selectItem
* @param {Object} item The item.
*/
ia.ComparisonPlotLayer.prototype.selectItem = function(item)
{
this.selectionContext.strokeStyle = item.color;
this._drawItem(item, this.selectionContext);
};
/**
* Does the actual drawing.
*
* @method _drawItem
* @param {Object} item The item.
* @param {HTML Canvas Context} ctx The context to render to.
* @private
*/
ia.ComparisonPlotLayer.prototype._drawItem = function(item, ctx)
{
ctx.beginPath();
ia.Shape.drawCircle(ctx, item.shape.x, item.shape.y, item.symbolSize);
ctx.fill();
ctx.stroke();
};
/**
* Runs a hit test on an item.
*
* @method hitItem
* @param {Object} item The item to hit test.
* @param {ia.MapMouseEvent} event An <code>ia.MapMouseEvent</code>.
*/
ia.ComparisonPlotLayer.prototype.hitItem = function(item, event)
{
if (this.isSelected(item.id) || this.displayAll)
{
return item.hitArea.intersects(event.x,event.y);
}
return false;
};