diff options
| author | Ana Krivokapic <akrivoka@redhat.com> | 2014-10-24 14:46:49 +0200 |
|---|---|---|
| committer | Ana Krivokapic <akrivoka@redhat.com> | 2015-02-11 19:27:13 +0100 |
| commit | 6614c74eb58107927154d8164157b42e2b24f370 (patch) | |
| tree | 4de74d81d169eaa32e8c0f30f833e159430a4353 | |
| parent | 9d2ff23c9e8d145681a2cff33c90e7937d8f6cc0 (diff) | |
| download | horizon-6614c74eb58107927154d8164157b42e2b24f370.tar.gz | |
Better color arrangement in distribution pie charts
(cherry picked from commit b6fd3ca0fdf4aecd3e4a69c39bb86ccb172c394c)
Closes-bug: #1385256
Change-Id: I581cdc6c33e546b1c2232360ae7cedd2dbdb8864
| -rw-r--r-- | horizon/static/horizon/js/horizon.d3piechart.js | 29 |
1 files changed, 15 insertions, 14 deletions
diff --git a/horizon/static/horizon/js/horizon.d3piechart.js b/horizon/static/horizon/js/horizon.d3piechart.js index 7c1672610..2e6ce6742 100644 --- a/horizon/static/horizon/js/horizon.d3piechart.js +++ b/horizon/static/horizon/js/horizon.d3piechart.js @@ -26,17 +26,18 @@ var BKGRND = "#F2F2F2"; var FRGRND = "#006CCF"; var FULL = "#D0342B"; var NEARLY_FULL = "#FFA500"; -var STROKE = "#CCCCCC"; +var STROKE_USAGE = "#CCCCCC"; +var STROKE_DISTRIBUTION = "#609ED2"; var BLUE_SHADES = [ - "#01002C", - "#011554", - "#00388A", - "#1366CE", - "#007CF8", - "#45911E", - "#41A0FE", - "#89BAF4", - "#B9DBFE" + "#609ED2", + "#BFD8ED", + "#EFF5FB", + "#2D6997", + "#1F4A6F", + "#122A40", + "#428BCA", + "#90BAE0", + "#DFEBF6" ]; @@ -93,7 +94,7 @@ horizon.d3_pie_chart_usage = { .attr("class","arc") .attr("d", arc) .style("fill", BKGRND) - .style("stroke", STROKE) + .style("stroke", STROKE_USAGE) .style("stroke-width", 1); // Animate filling the pie chart @@ -113,7 +114,7 @@ horizon.d3_pie_chart_usage = { return FRGRND; } }) - .style("stroke", STROKE) + .style("stroke", STROKE_USAGE) .style("stroke-width", function() { if (self.data[0].percentage <= 0 || self.data[0].percentage >= 100) { return 0; @@ -188,7 +189,7 @@ horizon.d3_pie_chart_distribution = { .attr("class","arc") .attr("d", arc) .style("fill", BKGRND) - .style("stroke", STROKE) + .style("stroke", STROKE_DISTRIBUTION) .style("stroke-width", 1); // Animate filling the pie chart @@ -202,7 +203,7 @@ horizon.d3_pie_chart_distribution = { .style("fill", function(d) { return self.colors[self.data.indexOf(d.data)]; }) - .style("stroke", STROKE) + .style("stroke", STROKE_DISTRIBUTION) .style("stroke-width", 1) .transition() .duration(500) |