Skip to content
GitLab
Menu
Projects
Groups
Snippets
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Sign in
Toggle navigation
Menu
Open sidebar
Sascha Herzinger
AdaCharts
Commits
a4226711
Commit
a4226711
authored
Mar 22, 2019
by
Sascha Herzinger
Browse files
fixes
#8
(barplot: add negative number handling)
parent
ccf5d90a
Changes
2
Hide whitespace changes
Inline
Side-by-side
examples/test-barplot.html
View file @
a4226711
...
...
@@ -38,24 +38,45 @@
}
const
series
=
[];
groups
.
forEach
(
group
=>
{
series
.
push
({
name
:
group
,
data
:
categories
.
map
(
category
=>
{
return
{
name
:
category
,
y
:
Math
.
floor
(
Math
.
random
()
*
10000
)
}
})
if
(
rng
<
0.33
)
{
// contains only negative
groups
.
forEach
(
group
=>
{
series
.
push
({
name
:
group
,
data
:
categories
.
map
(
category
=>
{
return
{
name
:
category
,
y
:
-
Math
.
floor
(
Math
.
random
()
*
10000
)
}
})
});
});
});
// if (rng
<
0.33
)
{
// contains only negative
//
// } else if (rng >= 0.33 && rng
<
0.66
)
{
// contains only positive
//
// } else { // contains negative and positive
//
// }
}
else
if
(
rng
>=
0.33
&&
rng
<
0.66
)
{
// contains only positive
groups
.
forEach
(
group
=>
{
series
.
push
({
name
:
group
,
data
:
categories
.
map
(
category
=>
{
return
{
name
:
category
,
y
:
Math
.
floor
(
Math
.
random
()
*
10000
)
}
})
});
});
}
else
{
// contains negative and positive
groups
.
forEach
(
group
=>
{
series
.
push
({
name
:
group
,
data
:
categories
.
map
(
category
=>
{
return
{
name
:
category
,
y
:
(
Math
.
random
()
<
0.5
?
1
:
-
1
)
*
Math
.
floor
(
Math
.
random
()
*
10000
)
}
})
});
});
}
return
{
groups
,
categories
,
...
...
src/charts/impl/Barplot.js
View file @
a4226711
...
...
@@ -43,11 +43,18 @@ export default class extends Chart {
})
{
const
groups
=
series
.
map
(
d
=>
d
.
name
);
const
data
=
[];
let
seriesContainsPositive
=
false
;
let
seriesContainsNegative
=
false
;
series
.
forEach
((
d
)
=>
{
d
.
data
.
forEach
((
e
)
=>
{
e
.
category
=
e
.
name
;
e
.
group
=
d
.
name
;
delete
e
.
name
;
if
(
e
.
y
>
0
)
{
seriesContainsPositive
=
true
;
}
else
{
seriesContainsNegative
=
true
;
}
data
.
push
(
e
);
});
});
...
...
@@ -86,8 +93,10 @@ export default class extends Chart {
.
domain
(
groups
)
.
range
([
0
,
x
.
bandwidth
()]);
const
maxValue
=
d3
.
max
(
data
.
map
(
d
=>
Math
.
abs
(
d
.
y
)));
const
y
=
d3
.
scaleLinear
()
.
domain
([
0
,
d3
.
max
(
data
.
map
(
d
=>
d
.
y
))
])
.
domain
([
!
seriesContainsNegative
?
0
:
-
maxValue
,
!
seriesContainsPositive
?
0
:
maxValue
])
.
range
([
height
,
0
]);
this
.
axisBottom
...
...
@@ -127,21 +136,29 @@ export default class extends Chart {
.
call
((
parent
)
=>
{
parent
.
append
(
'
rect
'
)
.
attr
(
'
x
'
,
d
=>
xSub
(
d
.
group
))
.
attr
(
'
y
'
,
height
)
.
attr
(
'
y
'
,
y
(
0
)
)
.
transition
()
.
duration
(
500
)
.
attr
(
'
x
'
,
d
=>
xSub
(
d
.
group
))
.
attr
(
'
y
'
,
d
=>
y
(
d
.
y
)
-
2
)
.
attr
(
'
y
'
,
d
=>
(
d
.
y
<
0
?
y
(
0
)
:
y
(
d
.
y
))
)
.
attr
(
'
width
'
,
xSub
.
bandwidth
())
.
attr
(
'
height
'
,
d
=>
height
-
y
(
d
.
y
)
+
2
)
.
attr
(
'
height
'
,
(
d
)
=>
{
if
(
seriesContainsNegative
&&
seriesContainsPositive
)
{
return
d
.
y
<
0
?
y
(
d
.
y
)
-
height
/
2
:
height
/
2
-
y
(
d
.
y
);
}
if
(
seriesContainsNegative
&&
!
seriesContainsPositive
)
{
return
y
(
d
.
y
);
}
return
height
-
y
(
d
.
y
);
})
.
attr
(
'
fill
'
,
d
=>
color
(
d
.
group
));
parent
.
append
(
'
text
'
)
.
attr
(
'
text-anchor
'
,
'
end
'
)
.
attr
(
'
text-anchor
'
,
d
=>
(
d
.
y
<
0
?
'
start
'
:
'
end
'
)
)
.
style
(
'
dominant-baseline
'
,
'
central
'
)
.
attr
(
'
transform
'
,
d
=>
`translate(
${
xSub
(
d
.
group
)
+
xSub
.
bandwidth
()
/
2
}
,
${
y
(
d
.
y
)
-
4
}
)rotate(90)`
)
.
attr
(
'
transform
'
,
d
=>
`translate(
${
xSub
(
d
.
group
)
+
xSub
.
bandwidth
()
/
2
}
,
${
y
(
d
.
y
)}
)rotate(90)`
)
.
style
(
'
visibility
'
,
'
hidden
'
)
.
text
(
d
=>
d
.
y
);
.
text
(
d
=>
`\u00A0
${
d
.
y
}
\u00A0`
);
})
.
merge
(
barGroup
)
.
on
(
'
click
'
,
d
=>
barClickCallback
(
d
))
...
...
@@ -174,15 +191,24 @@ export default class extends Chart {
.
transition
()
.
duration
(
500
)
.
attr
(
'
x
'
,
d
=>
xSub
(
d
.
group
))
.
attr
(
'
y
'
,
d
=>
y
(
d
.
y
)
-
2
)
.
attr
(
'
y
'
,
d
=>
(
d
.
y
<
0
?
y
(
0
)
:
y
(
d
.
y
))
)
.
attr
(
'
width
'
,
xSub
.
bandwidth
())
.
attr
(
'
height
'
,
d
=>
height
-
y
(
d
.
y
)
+
2
)
.
attr
(
'
height
'
,
(
d
)
=>
{
if
(
seriesContainsNegative
&&
seriesContainsPositive
)
{
return
d
.
y
<
0
?
y
(
d
.
y
)
-
height
/
2
:
height
/
2
-
y
(
d
.
y
);
}
if
(
seriesContainsNegative
&&
!
seriesContainsPositive
)
{
return
y
(
d
.
y
);
}
return
height
-
y
(
d
.
y
);
})
.
attr
(
'
fill
'
,
d
=>
color
(
d
.
group
));
parent
.
select
(
'
text
'
)
.
attr
(
'
transform
'
,
d
=>
`translate(
${
xSub
(
d
.
group
)
+
xSub
.
bandwidth
()
/
2
}
,
${
y
(
d
.
y
)
-
4
}
)rotate(90)`
)
.
attr
(
'
text-anchor
'
,
d
=>
(
d
.
y
<
0
?
'
start
'
:
'
end
'
))
.
attr
(
'
transform
'
,
d
=>
`translate(
${
xSub
(
d
.
group
)
+
xSub
.
bandwidth
()
/
2
}
,
${
y
(
d
.
y
)}
)rotate(90)`
)
.
style
(
'
visibility
'
,
'
hidden
'
)
.
text
(
d
=>
d
.
y
);
.
text
(
d
=>
`\u00A0
${
d
.
y
}
\u00A0`
);
});
barGroup
.
exit
()
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment