alex/restaurant-search
1
Fork 0
Code Releases Activity

Work in progress

Browse Source
This commit is contained in:
Alex Yatskov 2015-06-27 13:06:05 +09:00
parent 273e4c34d8
commit db7ad681ff
1 changed files with 60 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

74
static/scripts/grapher.js
View File

@ -83,7 +83,8 @@
var _padding = 5;
var _panelSize = 20;
var _tickSize = 5;
var _width = 100;
var _bracketSize = 10;
var _width = 120;
var _easeTime = 400;
var _animation = null;
@ -100,41 +101,86 @@
function createShapes() {
// backdrop
_elements.backdrop = _canvas.rect(
_tickSize, 0, _width - (_densitySize + _tickSize), _height - _panelSize
).attr({cursor: 'crosshair', stroke: _borderColor, fill: _backdropColor}).click(clicked);
_tickSize,
0,
_width - (_bracketSize + _densitySize + _tickSize),
_height - _panelSize
).attr({
cursor: 'crosshair',
stroke: _borderColor,
fill: _backdropColor
}).click(clicked);
// density
_elements.density = _canvas.rect(
_width - _densitySize, 0, _densitySize, _height - _panelSize
).attr({stroke: _borderColor});
_width - (_densitySize + _bracketSize),
0,
_densitySize,
_height - _panelSize
).attr({
stroke: _borderColor
});
// bracket
_elements.bracket = _canvas.rect(
_width - _bracketSize,
0,
_bracketSize,
_height - _panelSize
).attr({
fill: '#ff0000'
});
// panel
_elements.panel = _canvas.rect( _tickSize,
_height - _panelSize, _width - _tickSize, _panelSize
).attr({fill: _panelColor});
_elements.panel = _canvas.rect(
_tickSize,
_height - _panelSize,
_width - _tickSize,
_panelSize
).attr({
fill: _panelColor
});
// label
_elements.label = _canvas.text(
_tickSize + (_width - _tickSize) / 2, _height - _panelSize / 2, _name
).attr({'dominant-baseline': 'middle', 'text-anchor': 'middle'});
_tickSize + (_width - _tickSize) / 2,
_height - _panelSize / 2,
_name
).attr({
'dominant-baseline': 'middle',
'text-anchor': 'middle'
});
// indicator
var range = computeIndicatorRange(_data.value);
_elements.indicator = _canvas.rect(
_tickSize, range.min, _width - (_densitySize + _tickSize), (range.max - range.min)
).attr({cursor: 'crosshair', fill: computeIndicatorColor(_data.value)}).click(clicked);
_tickSize,
range.min,
_width - (_densitySize + _tickSize),
(range.max - range.min)
).attr({
cursor: 'crosshair',
fill: computeIndicatorColor(_data.value)
}).click(clicked);
// tick
if (_range.contains(0.0)) {
var origin = valueToIndicator(0.0);
_elements.tick = _canvas.line(0, origin, _width - _densitySize, origin
).attr({stroke: _tickColor});
_elements.tick = _canvas.line(
0,
origin,
_width - _densitySize,
origin
).attr({
stroke: _tickColor
});
}
_elements.group = _canvas.group(
_elements.backdrop,
_elements.indicator,
_elements.density,
_elements.bracket,
_elements.panel,
_elements.tick,
_elements.label