axisxlabels (string) : labels in x axis
asixywidth (number) : width of y axis area
axisystep (number) : number of steps in y axis
- axislinecolor (string) : color of lines in y axis
+ axislinecolor (string) : color of lines in axes
+ axisstrokewidth (number) : stroke width of lines in axes
axisfont (string) : font family of labels in axes
axisfontsize (number) : font size of labels in axes
axisfontweight (string) (number) : font weight of labels in axes
labelsize (number) : font size of labels
labelweight (string)(number) : font weight of labels
labelcolors (array) : font colors of the labels
+ labelborderradius (number) : border radius of the label boxes
+ labelmaxheight (number) : max height for the label boxes
+ labeloffsety (number) : horizontal distance between the label boxes and the bars below
legends (array) : legend
legendheight : height of the legend
legendkeyshape (string) : shape of the legend keys ('circle' / 'rect')
legendkeysize (number) : size of the legend keys (diameter for 'circle' and width for 'rect')
+ legendkeyoffsetx (number) : horizontal distance between the left border of the chart and the first top left legend key
+ legendkeyoffsety (number) : vertical distance between the top border of the chart and the first top left legend key
legendfont (string) : font family of the legend labels
legendfontsize (number) : font size of the legend labels
legendfontweight (string)(number) : font weight of the legend labels
barFill = opts.barfill || false, // default no fill
colors = opts.colors || chartinst.colors,
axisLineColor = opts.axislinecolor || '#BABABA',
+ axisStrokeWidth = opts.axisstrokewidth || 2,
axisFont = opts.axisfont || "'Fontin Sans', Fontin-Sans, sans-serif",
axisFontSize = opts.axisfontsize || ((barsteps > 10) ? 12 : 14),
axisFontWeight = opts.axisfontweight || 'bold',
labelSize = opts.labelsize || ((barsteps > 10) ? 10 : 12),
labelWeight = opts.labelweight || 'bold',
labelColors = opts.labelcolors || [],
+ labelBorderRadius = opts.labelborderradius || 4,
+ labelMaxHeight = opts.labelmaxheight || 30,
+ labelOffsetY = opts.labeloffsety || 20,
legendKeyShape = opts.legendkeyshape || 'circle',
legendKeySize = opts.legendkeysize || 16,
+ legendKeyOffsetX = typeof(opts.legendkeyoffsetx) != 'undefined' ? opts.legendkeyoffsetx : 10,
+ legendKeyOffsetY = typeof(opts.legendkeyoffsety) != 'undefined' ? opts.legendkeyoffsety : 10,
legendFont = opts.legendfont || "'Fontin Sans', Fontin-Sans, sans-serif",
legendFontSize = opts.legendfontsize || 14,
legendFontWeight = opts.legendfontweight || 'bold',
value = [value];
}
- // 10 pixels away from top of the chart
- // 10 pixels away from left of the chart
if(legendKeyShape == 'rect') {
// pass top left position for 'rect'
- paper.rect(x + (i * (width - x) / len) + 10, y + 10, legendKeySize, legendKeySize, 0).attr({ fill: colors[i%colors.length], "stroke": "#fff" });
+ paper.rect(x + (i * (width - x) / len) + legendKeyOffsetX, y + legendKeyOffsetY, legendKeySize, legendKeySize, 0).attr({ fill: colors[i%colors.length], "stroke": "#fff" });
}
else {
// pass center position for 'circle'
- paper.circle(x + (i * (width - x) / len) + 10 + (legendKeySize / 2), y + 10 + (legendKeySize / 2), legendKeySize / 2).attr({ fill: colors[i%colors.length], "stroke": "#fff" });
+ paper.circle(x + (i * (width - x) / len) + legendKeyOffsetX + (legendKeySize / 2), y + legendKeyOffsetY + (legendKeySize / 2), legendKeySize / 2).attr({ fill: colors[i%colors.length], "stroke": "#fff" });
}
// 10 pixels away from right of the legend key
// align legend key and text horizontally
- paper.text(x + (i * (width - x) / len) + 10 + legendKeySize + 10, y + 10 + (legendKeySize / 2) - legendFontSize / 10, opts.legends[i%opts.legends.length]).attr({
+ paper.text(x + (i * (width - x) / len) + legendKeyOffsetX + legendKeySize + 10, y + legendKeyOffsetY + (legendKeySize / 2) - legendFontSize / 10, opts.legends[i%opts.legends.length]).attr({
"font-size": legendFontSize,
"font-family": legendFont,
"font-weight": legendFontWeight,
// width and height of indicator
var iw = barWidth * 0.8;
- var ih = Math.min(30, iw * 0.5);
+ var ih = Math.min(labelMaxHeight, iw * 0.5);
// position of indicator
var ix = x + (k * (barWidth + barGutter)) + 1 + (barWidth - iw) / 2;
- var iy = y + opts.legendheight + 1 + (max - v) * unit - ih - 20;
+ var iy = y + opts.legendheight + 1 + (max - v) * unit - ih - labelOffsetY;
if(i == 0) {
- iy = y + opts.legendheight + 1 - ih - 20;
+ iy = y + opts.legendheight + 1 - ih - labelOffsetY;
}
- paper.rect(ix , iy, iw, ih, 4).attr({ stroke: "none", fill: colors[i%colors.length] });
+ paper.rect(ix , iy, iw, ih, labelBorderRadius).attr({ stroke: "none", fill: colors[i%colors.length] });
paper.path(["M", ix + (iw - 10) / 2, iy + ih, "l", 5, 10, "l", 5, -10]).attr({ stroke: "none", fill: colors[i%colors.length] });
// align labels center
paper.text(ix + iw / 2, iy + ih / 2 - labelSize / 10, Roo.util.Format.number(v, 0)).attr({
axisYWidth,
paper,
axisLineColor,
+ axisStrokeWidth,
axisFont,
axisFontSize,
axisFontWeight,
axisXHeight,
paper,
axisLineColor,
+ axisStrokeWidth,
axisFont,
axisFontSize,
axisFontWeight,
return new MVBarchart(this, x, y, width, height, values, opts);
};
- MVBarchart.prototype.rightAxis = function (x, y, length, max, steps, axisYWidth, paper, axisLineColor, axisFont, axisFontSize, axisFontWeight, axisFontColor)
+ MVBarchart.prototype.rightAxis = function (x, y, length, max, steps, axisYWidth, paper, axisLineColor, axisStrokeWidth, axisFont, axisFontSize, axisFontWeight, axisFontColor)
{
// Roo.log('Right Axis');
// Roo.log([x, y, length, max, steps, axisYWidth]);
Y -= dx;
}
- var res = paper.path(path).attr({ stroke: axisLineColor, "stroke-width": 2 });
+ var res = paper.path(path).attr({ stroke: axisLineColor, "stroke-width": axisStrokeWidth });
res.text = text;
res.all = paper.set([res, text]);
return res;
}
- MVBarchart.prototype.bottomAxis = function (x, y, length, labels, barsteps, barWidth, barGutter, height, paper, axisLineColor, axisFont, axisFontSize, axisFontWeight, axisFontColor)
+ MVBarchart.prototype.bottomAxis = function (x, y, length, labels, barsteps, barWidth, barGutter, height, paper, axisLineColor, axisStrokeWidth, axisFont, axisFontSize, axisFontWeight, axisFontColor)
{
// Roo.log('Bottom Axis');
// Roo.log([x, y, length, steps, labels, barWidth]);
});
});
- var res = paper.path(path).attr({ stroke: axisLineColor, "stroke-width": 2 });
+ var res = paper.path(path).attr({ stroke: axisLineColor, "stroke-width": axisStrokeWidth });
res.text = text;
res.all = paper.set([res, text]);