5 Handles laying out legend into a DIV element.
6 Design taken from comments of Julien Wajsberg (http://
7 groups.google.com/group/plotkit/browse_thread/thread/2494bd88e6e9956d)
8 and Niel Domingo (http://nieldomingo.blogspot.com/2007/03/legend-
9 for-plotkit-bar-charts.html).
13 Copyright 2007 (c) Ashley Martens <ashleym_72^yahoo.com>
14 For use under the BSD license. <http://www.liquidx.net/plotkit>
19 if (typeof(MochiKit
.Base
) == 'undefined' ||
20 typeof(MochiKit
.DOM
) == 'undefined' ||
21 typeof(MochiKit
.Color
) == 'undefined' ||
22 typeof(MochiKit
.Format
) == 'undefined' ||
23 typeof(PlotKit
.Layout
) == 'undefined' ||
24 typeof(PlotKit
.Base
) == 'undefined')
30 throw "PlotKit depends on MochiKit.{Base,Color,DOM,Format}"
33 if (typeof(PlotKit
.LegendRenderer
) == 'undefined') {
34 PlotKit
.LegendRenderer
= {};
37 PlotKit
.LegendRenderer = function(element
, layout
, options
) {
38 if (arguments
.length
> 0)
39 this.__init__(element
, layout
, options
);
43 PlotKit
.LegendRenderer
.NAME
= "PlotKit.LegendRenderer";
44 PlotKit
.LegendRenderer
.VERSION
= PlotKit
.VERSION
;
46 PlotKit
.LegendRenderer
.__repr__ = function() {
47 return "[" + this.NAME
+ " " + this.VERSION
+ "]";
50 PlotKit
.LegendRenderer
.toString = function() {
51 return this.__repr__();
54 PlotKit
.LegendRenderer
.prototype.__init__ = function(element
, layout
,
56 var isNil
= MochiKit
.Base
.isUndefinedOrNull
;
57 var Color
= MochiKit
.Color
.Color
;
60 "colorScheme": PlotKit
.Base
.palette(PlotKit
.Base
.baseColors()
62 "legendStyle": "table",
65 MochiKit
.Base
.update(this.options
, options
? options
: {});
68 this.element
= MochiKit
.DOM
.getElement(element
);
69 // --- check whether everything is ok before we return
71 if (isNil(this.element
))
72 throw "CRILegend() - passed legend is not found";
75 PlotKit
.LegendRenderer
.prototype.render = function() {
76 var colorScheme
= this.options
.colorScheme
;
77 var setNames
= PlotKit
.Base
.keys(this.layout
.datasets
);
79 MochiKit
.DOM
.updateNodeAttributes(this.element
,
88 if (this.options
.legendStyle
== "table")
89 ul
= this._renderListTable(colorScheme
, setNames
);
91 ul
= this._renderList(colorScheme
, setNames
);
92 MochiKit
.DOM
.appendChildNodes(this.element
, ul
);
96 PlotKit
.LegendRenderer
.prototype._renderList = function(colorScheme
,
98 var ul
= document
.createElement("ul");
99 ul
.style
.listStyle
="none";
101 ul
.style
.padding
="0";
103 var colorCount
= colorScheme
.length
;
104 var setCount
= setNames
.length
;
106 for (var i
= 0; i
< setCount
; i
++) {
107 var setName
= setNames
[i
];
108 var color
= colorScheme
[i
%colorCount
];
109 var le
= this._renderElement(setName
, color
.toRGBString());
116 PlotKit
.LegendRenderer
.prototype._renderElement = function(title
,
118 var le
= MochiKit
.DOM
.createDOM("li");
119 le
.style
.listStyle
="none";
120 le
.style
.margin
="0 0 5px 0";
121 le
.style
.padding
="0";
123 var box
= MochiKit
.DOM
.createDOM("div");
124 box
.style
.backgroundColor
=color
;
125 box
.style
.width
="2em";
126 box
.style
.height
=".9em";
127 box
.style
.border
="1px solid black";
128 box
.style
.margin
="0 5px 0 0";
129 box
.style
.padding
="0";
130 box
.style
.float="left";
131 box
.style
.cssFloat
="left";
132 box
.style
.clear
="left";
133 box
.style
.cssClear
="left";
135 var span
= MochiKit
.DOM
.createDOM("span");
136 MochiKit
.DOM
.appendChildNodes(span
,
137 document
.createTextNode(title
));
139 MochiKit
.DOM
.appendChildNodes(le
, box
, span
);
144 PlotKit
.LegendRenderer
.prototype._renderListTable
=
145 function(colorScheme
, setNames
) {
146 var tabhead
= THEAD(null);
147 var tabfoot
= TFOOT(null);
149 var tabbody
= partial(TBODY
, null);
151 var colorcount
= colorScheme
.length
;
153 var columns
= this.options
.tableColumns
;
154 for (var label
in setNames
)
156 var legendcolor
= colorScheme
[i
%colorcount
];
157 var legendbox
= DIV({'class': 'legendbox', 'className':
159 legendbox
.style
.width
= "10px";
160 legendbox
.style
.height
= "10px";
161 legendbox
.style
.backgroundColor
= legendcolor
.toHexString();
162 legendbox
.style
.borderWidth
= "1px";
163 legendbox
.style
.borderStyle
= "solid";
164 legendbox
.style
.borderColor
= "#000000";
165 var boxcell
= TD(null, legendbox
);
167 var labelcell
= TD({'class': 'legendlabel', 'className':
168 'legendlabel'}, setNames
[i
]);
169 labelcell
.style
.font
= 'normal 10pt arial';
173 tabrow
= partial(TR
, null);
175 tabrow
= partial(tabrow
, boxcell
, labelcell
);
178 tabrow
= tabrow(null);
179 tabbody
= partial(tabbody
, tabrow
);
183 if ((setNames
% columns
))
185 tabrow
= tabrow(TD(null), TD(null));
186 tabbody
= partial(tabbody
, tabrow
);
188 tabbody
= tabbody(null);
190 tab
= TABLE({'class': 'legendcontainer', 'className':
191 'legendcontainer'}, tabhead
, tabfoot
, tabbody
);
192 tab
.style
.marginTop
= '1em';
193 tab
.style
.marginLeft
= '1.5em';
194 tab
.style
.marginBottom
= '1em';
195 tab
.style
.borderWidth
= '1px';
196 tab
.style
.borderStyle
= 'solid';
197 tab
.style
.borderColor
= '#000000';
202 // Namespace Iniitialisation
205 PlotKit
.Legend
.LegendRenderer
= PlotKit
.LegendRenderer
;
208 PlotKit
.Legend
.EXPORT
= [
212 PlotKit
.Legend
.EXPORT_OK
= [
216 PlotKit
.Legend
.__new__ = function() {
217 var m
= MochiKit
.Base
;
219 m
.nameFunctions(this);
222 ":common": this.EXPORT
,
223 ":all": m
.concat(this.EXPORT
, this.EXPORT_OK
)
227 PlotKit
.Legend
.__new__();
228 MochiKit
.Base
._exportSymbols(this, PlotKit
.Legend
);