mirror of
https://github.com/morrisjs/morris.js.git
synced 2024-11-11 05:46:37 +01:00
Merge branch 'feature/rounded_corners' of https://github.com/sudodoki/morris.js into sudodoki-feature/rounded_corners
This commit is contained in:
commit
415476f7ca
@ -108,7 +108,7 @@ class Morris.Bar extends Morris.Grid
|
|||||||
size = bottom - top
|
size = bottom - top
|
||||||
|
|
||||||
top -= lastTop if @options.stacked
|
top -= lastTop if @options.stacked
|
||||||
@drawBar(left, top, barWidth, size, @colorFor(row, sidx, 'bar'))
|
@drawBar(left, top, barWidth, size, @colorFor(row, sidx, 'bar'), @options.barStyle?.opacity, @options.barStyle?.radius)
|
||||||
|
|
||||||
lastTop += size
|
lastTop += size
|
||||||
else
|
else
|
||||||
@ -181,7 +181,23 @@ class Morris.Bar extends Morris.Grid
|
|||||||
.attr('font-weight', @options.gridTextWeight)
|
.attr('font-weight', @options.gridTextWeight)
|
||||||
.attr('fill', @options.gridTextColor)
|
.attr('fill', @options.gridTextColor)
|
||||||
|
|
||||||
drawBar: (xPos, yPos, width, height, barColor) ->
|
|
||||||
@raphael.rect(xPos, yPos, width, height)
|
drawBar: (xPos, yPos, width, height, barColor, opacity = '1', radius = [0,0,0,0]) ->
|
||||||
|
if Math.max(radius...) > height or (r for r in radius when r is 0).length is 4
|
||||||
|
path = @raphael.rect(xPos, yPos, width, height)
|
||||||
|
else
|
||||||
|
path = @raphael.path @roundedRect(xPos, yPos, width, height, radius)
|
||||||
|
|
||||||
|
|
||||||
|
path
|
||||||
.attr('fill', barColor)
|
.attr('fill', barColor)
|
||||||
.attr('stroke-width', 0)
|
.attr('stroke-width', 0)
|
||||||
|
.attr('fill-opacity', opacity)
|
||||||
|
|
||||||
|
roundedRect: (x, y, w, h, r = [0,0,0,0]) ->
|
||||||
|
[].
|
||||||
|
concat(["M", x, r[0] + y, "Q", x, y, x + r[0], y]).
|
||||||
|
concat(["L", x + w - r[1], y, "Q", x + w, y, x + w, y + r[1]]).
|
||||||
|
concat(["L", x + w, y + h - r[2], "Q", x + w, y + h, x + w - r[2], y + h]).
|
||||||
|
concat(["L", x + r[3], y + h, "Q", x, y + h, x, y + h - r[3], "Z"])
|
||||||
|
|
||||||
|
@ -48,3 +48,26 @@ describe 'Morris.Bar', ->
|
|||||||
it 'should have text with configured font size', ->
|
it 'should have text with configured font size', ->
|
||||||
chart = Morris.Bar $.extend {}, defaults
|
chart = Morris.Bar $.extend {}, defaults
|
||||||
$('#graph').find("text[font-size='12px']").size().should.equal 7
|
$('#graph').find("text[font-size='12px']").size().should.equal 7
|
||||||
|
|
||||||
|
describe 'when setting bar radius', ->
|
||||||
|
describe 'svg structure', ->
|
||||||
|
defaults =
|
||||||
|
element: 'graph'
|
||||||
|
data: [{x: 'foo', y: 2, z: 3}, {x: 'bar', y: 4, z: 6}]
|
||||||
|
xkey: 'x'
|
||||||
|
ykeys: ['y', 'z']
|
||||||
|
labels: ['Y', 'Z']
|
||||||
|
barStyle: {
|
||||||
|
radius: [5, 5, 0, 0]
|
||||||
|
}
|
||||||
|
it 'should contain a path for each bar', ->
|
||||||
|
chart = Morris.Bar $.extend {}, defaults
|
||||||
|
$('#graph').find("path").size().should.equal 9
|
||||||
|
|
||||||
|
it 'should use rects if radius is too big', ->
|
||||||
|
delete defaults.barStyle
|
||||||
|
chart = Morris.Bar $.extend {
|
||||||
|
barStyle:
|
||||||
|
radius: [300, 300, 0, 0]
|
||||||
|
}, defaults
|
||||||
|
$('#graph').find("rect").size().should.equal 4
|
||||||
|
Loading…
Reference in New Issue
Block a user