From 3c659c7acef5c4590c9fe8d80094cbf164bfbca5 Mon Sep 17 00:00:00 2001 From: Alan Date: Tue, 12 Mar 2024 17:40:34 +0800 Subject: [PATCH] fix #8056 - more refinements to checking data --- g.bar.overlay.js | 40 ++++++++++++++++++++++++++-------------- 1 file changed, 26 insertions(+), 14 deletions(-) diff --git a/g.bar.overlay.js b/g.bar.overlay.js index 0fa8f26..cd86f60 100644 --- a/g.bar.overlay.js +++ b/g.bar.overlay.js @@ -55,7 +55,8 @@ if (typeof(Raphael) == 'undefined') { 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 @@ -64,10 +65,15 @@ if (typeof(Raphael) == 'undefined') { 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 @@ -91,6 +97,7 @@ if (typeof(Raphael) == 'undefined') { 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', @@ -99,8 +106,13 @@ if (typeof(Raphael) == 'undefined') { 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', @@ -162,20 +174,18 @@ if (typeof(Raphael) == 'undefined') { 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, @@ -201,17 +211,17 @@ if (typeof(Raphael) == 'undefined') { // 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({ @@ -237,6 +247,7 @@ if (typeof(Raphael) == 'undefined') { axisYWidth, paper, axisLineColor, + axisStrokeWidth, axisFont, axisFontSize, axisFontWeight, @@ -257,6 +268,7 @@ if (typeof(Raphael) == 'undefined') { axisXHeight, paper, axisLineColor, + axisStrokeWidth, axisFont, axisFontSize, axisFontWeight, @@ -279,7 +291,7 @@ if (typeof(Raphael) == 'undefined') { 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]); @@ -312,7 +324,7 @@ if (typeof(Raphael) == 'undefined') { 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]); @@ -324,7 +336,7 @@ if (typeof(Raphael) == 'undefined') { 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]); @@ -345,7 +357,7 @@ if (typeof(Raphael) == 'undefined') { }); }); - 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]); -- 2.39.2