diff --git a/demo/simple_test.py b/demo/simple_test.py index e6e522a..8b8c8a2 100755 --- a/demo/simple_test.py +++ b/demo/simple_test.py @@ -29,6 +29,7 @@ bar.add('test1', rng) bar.add('test2', map(abs, rng)) bar.x_labels = map(str, rng) bar.title = "Bar test" +bar.fill = True with open('out-bar.svg', 'w') as f: f.write(bar.render()) @@ -71,8 +72,8 @@ hstackedbar.add('--->', rng3) with open('out-horizontalstackedbar.svg', 'w') as f: f.write(hstackedbar.render()) -line = Line(Config(y_scale=.0005, fill=True, style=NeonStyle, - interpolate='univariate', show_dots=False)) +line = Line(Config(y_scale=.0005, style=NeonStyle, + interpolate='univariate')) rng = range(-30, 31, 10) line.add('test1', [cos(x / 10.) for x in rng]) line.add('test2', [sin(x / 10.) for x in rng]) diff --git a/pygal/css/graph.css b/pygal/css/graph.css index 06fbac5..64d0a23 100644 --- a/pygal/css/graph.css +++ b/pygal/css/graph.css @@ -91,7 +91,10 @@ svg * { opacity: 0; } -.axis.y .guides:hover .guide.line, .Line .axis.x .guides:hover .guide.line, .XY .axis.x .guides:hover .guide.line { +.axis.y .guides:hover .guide.line, +.Line .axis.x .guides:hover .guide.line, +.StackedLine .axis.x .guides:hover .guide.line, +.XY .axis.x .guides:hover .guide.line { stroke: {{ style.foreground_light }}; opacity: 1; } @@ -101,14 +104,19 @@ svg * { opacity: 1; } -.series .dots .dot circle { +.dot circle { stroke-width: 1px; + fill-opacity: 1; } -.series .dots .dot:hover circle { +.dot circle.active { stroke-width: 5px; } +.nofill { + fill: none; +} + .reactive { fill-opacity: {{ style.opacity }}; } @@ -130,11 +138,5 @@ svg * { opacity: 1; } -/* .series .line { */ -/* fill-opacity: {{ fill_opacity }}; */ -/* } */ - - - {{ style.colors }} diff --git a/pygal/graph/bar.py b/pygal/graph/bar.py index 22871ea..9c41eb9 100644 --- a/pygal/graph/bar.py +++ b/pygal/graph/bar.py @@ -81,7 +81,7 @@ class Bar(Graph): else: y += height / 2 + .3 * self.values_font_size self.svg.transposable_node( - bar, 'text', + serie_node['overlay'], 'text', x=x + bar_inner_width / 2, y=y - shift, id="reactive-%s" % tag, diff --git a/pygal/graph/line.py b/pygal/graph/line.py index 0469db2..25019b6 100644 --- a/pygal/graph/line.py +++ b/pygal/graph/line.py @@ -65,7 +65,7 @@ class Line(Graph): view_values = self._fill(view_values) self.svg.line( serie_node['plot'], view_values, - class_='line reactive') + class_='line reactive' + (' nofill' if not self.fill else '')) def _compute(self): self._x_pos = [x / float(self._len - 1) for x in range(self._len) diff --git a/pygal/js/graph.coffee b/pygal/js/graph.coffee index 053c5fa..b8eba2f 100644 --- a/pygal/js/graph.coffee +++ b/pygal/js/graph.coffee @@ -23,17 +23,18 @@ deactivate = (elements...) -> for element in elements rm_class(element, 'active') +Function.prototype.bind = (scope) -> + _fun = @ + -> + _fun.apply(scope, arguments) + reactive = (element) -> document.getElementById('re' + element.id) active = (element) -> document.getElementById(element.id.replace(/re/, '')) hover = (elts, over, out) -> for elt in elts - elt.addEventListener('mouseover', - ((elt) -> (-> over.call(elt)))(elt) - , false) - elt.addEventListener('mouseout', - ((elt) -> (-> out.call(elt)))(elt) - , false) + elt.addEventListener('mouseover', over.bind(elt) , false) + elt.addEventListener('mouseout', out.bind(elt) , false) @svg_load = -> hover _('.reactive-text'), (-> activate(@, active(@))), (-> deactivate(@, active(@))) diff --git a/pygal/js/graph.js b/pygal/js/graph.js index 97cca2e..1c75190 100644 --- a/pygal/js/graph.js +++ b/pygal/js/graph.js @@ -49,6 +49,14 @@ return _results; }; + Function.prototype.bind = function(scope) { + var _fun; + _fun = this; + return function() { + return _fun.apply(scope, arguments); + }; + }; + reactive = function(element) { return document.getElementById('re' + element.id); }; @@ -62,16 +70,8 @@ _results = []; for (_i = 0, _len = elts.length; _i < _len; _i++) { elt = elts[_i]; - elt.addEventListener('mouseover', (function(elt) { - return function() { - return over.call(elt); - }; - })(elt), false); - _results.push(elt.addEventListener('mouseout', (function(elt) { - return function() { - return out.call(elt); - }; - })(elt), false)); + elt.addEventListener('mouseover', over.bind(elt), false); + _results.push(elt.addEventListener('mouseout', out.bind(elt), false)); } return _results; }; diff --git a/pygal/style.py b/pygal/style.py index f33147d..5f804d2 100644 --- a/pygal/style.py +++ b/pygal/style.py @@ -26,7 +26,7 @@ class Style(object): foreground_light='#eee', foreground_dark='#555', opacity='.8', - opacity_hover='1', + opacity_hover='.3', transition='250ms', colors=( '#ff5995', '#b6e354', '#feed6c', '#8cedff', '#9e6ffe', diff --git a/pygal/svg.py b/pygal/svg.py index 70c66e9..bc4171f 100644 --- a/pygal/svg.py +++ b/pygal/svg.py @@ -52,11 +52,7 @@ class Svg(object): f.read(), style=self.graph.style, font_sizes=self.graph.font_sizes, - hidden='y' if self.graph._horizontal else 'x', - fill_opacity=self.graph.style.opacity - if self.graph.fill else .4, - fill_opacity_hover=self.graph.style.opacity_hover - if self.graph.fill else .6) + hidden='y' if self.graph._horizontal else 'x') style.text = templ.decode('utf-8') def add_script(self, js):