Skip to content

Commit ba451d8

Browse files
rueckstiessrueckstiess
committed
determine ui elements via .selectable class
1 parent 37047ca commit ba451d8

File tree

9 files changed

+42
-108
lines changed

9 files changed

+42
-108
lines changed

‎src/minicharts/d3fns/boolean.js‎

Lines changed: 1 addition & 58 deletions
Original file line numberDiff line numberDiff line change
@@ -70,68 +70,11 @@ var minicharts_d3fns_boolean = function() {
7070

7171
chart.options = function(value) {
7272
if (!arguments.length) return options;
73-
options = value;
73+
_.assign(options, value);
7474
return chart;
7575
};
7676

7777
return chart;
7878
};
7979

80-
// var minicharts_d3fns_boolean = function(opts) {
81-
// var values = opts.model.values.toJSON();
82-
//
83-
// // group by true/false
84-
// var data = _(values)
85-
// .groupBy(function(d) {
86-
// return d;
87-
// })
88-
// .defaults({
89-
// false: [],
90-
// true: []
91-
// })
92-
// .map(function(v, k) {
93-
// return {
94-
// label: k,
95-
// value: k === 'true',
96-
// count: v.length
97-
// };
98-
// })
99-
// .sortByOrder('label', [false]) // order: false, true
100-
// .value();
101-
//
102-
// var margin = shared.margin;
103-
//
104-
// var width = opts.width - margin.left - margin.right;
105-
// var height = opts.height - margin.top - margin.bottom;
106-
// var el = opts.el;
107-
//
108-
// // clear el first
109-
// d3.select(el).selectAll('*').remove();
110-
//
111-
// var g = d3.select(el)
112-
// .append('g')
113-
// .attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
114-
//
115-
// var chart = few()
116-
// .width(width)
117-
// .height(height)
118-
// .options({
119-
// view: opts.view
120-
// });
121-
//
122-
// d3.select(g)
123-
// .datum(data)
124-
// .call(chart);
125-
//
126-
// // simulate data changes
127-
// // setInterval(function() {
128-
// // _.each(data, function(d) {
129-
// // d.count = _.random(0, 100);
130-
// // });
131-
// // d3.select(g).call(chart);
132-
// // }, 500);
133-
//
134-
// // few(data, opts.view, g, width, height);
135-
// };
136-
13780
module.exports = minicharts_d3fns_boolean;

‎src/minicharts/d3fns/date.js‎

Lines changed: 9 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,7 @@ var minicharts_d3fns_date = function() {
5454
.on('brushend', brushend);
5555

5656
function brushed() {
57-
var lines = d3.selectAll(options.view.queryAll('.line'));
57+
var lines = d3.selectAll(options.view.queryAll('.selectable'));
5858
var s = brush.extent();
5959

6060
lines.classed('selected', function(d) {
@@ -67,7 +67,7 @@ var minicharts_d3fns_date = function() {
6767
}
6868

6969
function brushend() {
70-
var lines = d3.selectAll(options.view.queryAll('.line'));
70+
var lines = d3.selectAll(options.view.queryAll('.selectable'));
7171
if (brush.empty()) {
7272
lines.classed('selected', false);
7373
lines.classed('unselected', false);
@@ -76,7 +76,6 @@ var minicharts_d3fns_date = function() {
7676

7777
if (!options.view) return;
7878
var evt = {
79-
selected: options.view.queryAll('line.line.selected'),
8079
type: 'drag',
8180
source: 'many'
8281
};
@@ -87,7 +86,6 @@ var minicharts_d3fns_date = function() {
8786
var evt = {
8887
d: d,
8988
self: this,
90-
all: options.view.queryAll('line.line'),
9189
evt: d3.event,
9290
type: 'click',
9391
source: 'date'
@@ -222,13 +220,13 @@ var minicharts_d3fns_date = function() {
222220
.attr('y', barcodeTop)
223221
.attr('height', barcodeBottom - barcodeTop);
224222

225-
var lines = g.selectAll('.line')
223+
var lines = g.selectAll('.selectable')
226224
.data(values, function(d) {
227225
return d.ts;
228226
});
229227

230228
lines.enter().append('line')
231-
.attr('class', 'line')
229+
.attr('class', 'line selectable')
232230
.on('mouseover', tip.show)
233231
.on('mouseout', tip.hide)
234232
.on('mousedown', handleMouseDown);
@@ -278,10 +276,12 @@ var minicharts_d3fns_date = function() {
278276
var weekdayContainer = g.select('g.weekday').data([weekdays]);
279277

280278
raf(function() {
279+
var chartWidth = width / (upperRatio + 1) - upperMargin;
281280
var chart = many()
282-
.width(width / (upperRatio + 1) - upperMargin)
281+
.width(chartWidth)
283282
.height(upperBarBottom)
284283
.options({
284+
selectable: false,
285285
bgbars: true,
286286
labels: {
287287
'text-anchor': 'middle',
@@ -301,6 +301,7 @@ var minicharts_d3fns_date = function() {
301301
.width(chartWidth)
302302
.height(upperBarBottom)
303303
.options({
304+
selectable: false,
304305
bgbars: true,
305306
labels: {
306307
text: function(d, i) {
@@ -328,7 +329,7 @@ var minicharts_d3fns_date = function() {
328329

329330
chart.options = function(value) {
330331
if (!arguments.length) return options;
331-
options = value;
332+
_.assign(options, value);
332333
return chart;
333334
};
334335

‎src/minicharts/d3fns/few.js‎

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -32,11 +32,10 @@ var minicharts_d3fns_few = function() {
3232

3333
function handleClick(d) {
3434
if (!options.view) return;
35-
var fgRect = $(this).siblings('rect.fg')[0];
35+
var fgRect = $(this).siblings('rect.selectable')[0];
3636
var evt = {
3737
d: d,
3838
self: fgRect,
39-
all: options.view.queryAll('rect.fg'),
4039
evt: d3.event,
4140
type: 'click',
4241
source: 'few'
@@ -45,7 +44,7 @@ var minicharts_d3fns_few = function() {
4544
}
4645

4746
function brushed() {
48-
var bars = d3.selectAll(options.view.queryAll('rect.fg'));
47+
var bars = d3.selectAll(options.view.queryAll('rect.selectable'));
4948
var s = brush.extent();
5049

5150
bars.classed('selected', function(d) {
@@ -61,7 +60,7 @@ var minicharts_d3fns_few = function() {
6160
}
6261

6362
function brushend() {
64-
var bars = d3.selectAll(options.view.queryAll('rect.fg'));
63+
var bars = d3.selectAll(options.view.queryAll('rect.selectable'));
6564
if (brush.empty()) {
6665
bars.classed('selected', false);
6766
bars.classed('unselected', false);
@@ -70,7 +69,6 @@ var minicharts_d3fns_few = function() {
7069

7170
if (!options.view) return;
7271
var evt = {
73-
selected: options.view.queryAll('rect.fg.selected'),
7472
type: 'drag',
7573
source: 'many'
7674
};
@@ -167,7 +165,7 @@ var minicharts_d3fns_few = function() {
167165

168166
barEnter.append('rect')
169167
.attr('class', function(d, i) {
170-
return 'fg fg-' + i;
168+
return 'selectable fg fg-' + i;
171169
})
172170
.attr('y', 0)
173171
.attr('x', 0)
@@ -189,7 +187,7 @@ var minicharts_d3fns_few = function() {
189187
.on('mouseout', tip.hide)
190188
.on('mousedown', handleMouseDown);
191189

192-
bar.select('rect.fg')
190+
bar.select('rect.selectable')
193191
.transition()
194192
.attr('width', function(d) {
195193
return xScale(d.count);
@@ -224,7 +222,7 @@ var minicharts_d3fns_few = function() {
224222

225223
chart.options = function(value) {
226224
if (!arguments.length) return options;
227-
options = value;
225+
_.assign(options, value);
228226
return chart;
229227
};
230228

‎src/minicharts/d3fns/many.js‎

Lines changed: 14 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,8 @@ var minicharts_d3fns_many = function() {
1515
view: null,
1616
bgbars: false,
1717
scale: false,
18-
labels: false // label defaults will be set further below
18+
labels: false, // label defaults will be set further below
19+
selectable: true // setting to false disables query builder for this chart
1920
};
2021

2122
var xScale = d3.scale.ordinal();
@@ -35,11 +36,10 @@ var minicharts_d3fns_many = function() {
3536
// --- end chart setup ---
3637

3738
function handleClick(d) {
38-
if (!options.view) return;
39+
if (!options.view || !options.selectable) return;
3940
var evt = {
4041
d: d,
4142
self: this,
42-
all: options.view.queryAll('rect.fg'),
4343
evt: d3.event,
4444
type: 'click',
4545
source: 'many'
@@ -48,7 +48,7 @@ var minicharts_d3fns_many = function() {
4848
}
4949

5050
function brushed() {
51-
var bars = d3.selectAll(options.view.queryAll('rect.fg'));
51+
var bars = d3.selectAll(options.view.queryAll('rect.selectable'));
5252
var s = brush.extent();
5353

5454
bars.classed('selected', function(d) {
@@ -64,7 +64,7 @@ var minicharts_d3fns_many = function() {
6464
}
6565

6666
function brushend() {
67-
var bars = d3.selectAll(options.view.queryAll('rect.fg'));
67+
var bars = d3.selectAll(options.view.queryAll('rect.selectable'));
6868
if (brush.empty()) {
6969
bars.classed('selected', false);
7070
bars.classed('unselected', false);
@@ -73,14 +73,14 @@ var minicharts_d3fns_many = function() {
7373

7474
if (!options.view) return;
7575
var evt = {
76-
selected: options.view.queryAll('rect.fg.selected'),
7776
type: 'drag',
7877
source: 'many'
7978
};
8079
options.view.trigger('querybuilder', evt);
8180
}
8281

8382
function handleMouseDown() {
83+
if (!options.selectable) return;
8484
var bar = this;
8585
var parent = $(this).closest('.minichart');
8686
var background = parent.find('g.brush > rect.background')[0];
@@ -213,9 +213,7 @@ var minicharts_d3fns_many = function() {
213213
legend.exit().remove();
214214
}
215215

216-
// @note currently the bgbars are only use for the day/week and hour/day charts.
217-
// they don't support query building anyway.
218-
if (!options.bgbars) {
216+
if (options.selectable) {
219217
var gBrush = el.selectAll('.brush').data([0]);
220218
gBrush.enter().append('g')
221219
.attr('class', 'brush')
@@ -249,7 +247,7 @@ var minicharts_d3fns_many = function() {
249247
// now attach the foreground bars
250248
barEnter
251249
.append('rect')
252-
.attr('class', 'fg')
250+
.attr('class', options.selectable ? 'fg selectable' : 'fg')
253251
.attr('x', 0)
254252
.attr('width', xScale.rangeBand());
255253

@@ -269,8 +267,11 @@ var minicharts_d3fns_many = function() {
269267
// ... or attach tooltips directly to foreground bars if we don't use background bars
270268
bar.selectAll('.fg')
271269
.on('mouseover', tip.show)
272-
.on('mouseout', tip.hide)
273-
.on('mousedown', handleMouseDown);
270+
.on('mouseout', tip.hide);
271+
272+
if (options.selectable) {
273+
bar.on('mousedown', handleMouseDown);
274+
}
274275
}
275276

276277
if (options.labels) {
@@ -318,7 +319,7 @@ var minicharts_d3fns_many = function() {
318319

319320
chart.options = function(value) {
320321
if (!arguments.length) return options;
321-
options = value;
322+
_.assign(options, value);
322323
return chart;
323324
};
324325

‎src/minicharts/d3fns/number.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -110,7 +110,7 @@ var minicharts_d3fns_number = function() {
110110

111111
chart.options = function(value) {
112112
if (!arguments.length) return options;
113-
options = value;
113+
_.assign(options, value);
114114
return chart;
115115
};
116116

‎src/minicharts/d3fns/string.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -73,7 +73,7 @@ var minicharts_d3fns_string = function() {
7373

7474
chart.options = function(value) {
7575
if (!arguments.length) return options;
76-
options = value;
76+
_.assign(options, value);
7777
return chart;
7878
};
7979

0 commit comments

Comments
 (0)