github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-23 17:28:26 -04:00
Code Issues Projects Releases Packages Wiki Activity

fixing indentation to match our style

Browse source
This commit is contained in:
ppisljar 2016-09-08 17:08:56 +02:00
parent 9cb6b60fe0
commit 0b63b830f2
17 changed files with 421 additions and 420 deletions
Download patch file Download diff file Expand all files Collapse all files

24
src/ui/public/vislib/lib/alerts.js
View file

@ -61,21 +61,21 @@ export default function AlertsFactory(Private) {
const data = this.data;
const alerts = _(this.alertDefs)
.map(function (alertDef) {
if (!alertDef) return;
if (alertDef.test && !alertDef.test(vis, data)) return;
.map(function (alertDef) {
if (!alertDef) return;
if (alertDef.test && !alertDef.test(vis, data)) return;
const type = alertDef.type || 'info';
const icon = alertDef.icon || type;
const msg = alertDef.msg;
const type = alertDef.type || 'info';
const icon = alertDef.icon || type;
const msg = alertDef.msg;
// alert container
const $icon = $('<i>').addClass('vis-alerts-icon fa fa-' + icon);
const $text = $('<p>').addClass('vis-alerts-text').text(msg);
// alert container
const $icon = $('<i>').addClass('vis-alerts-icon fa fa-' + icon);
const $text = $('<p>').addClass('vis-alerts-text').text(msg);
return $('<div>').addClass('vis-alert vis-alert-' + type).append([$icon, $text]);
})
.compact();
return $('<div>').addClass('vis-alert vis-alert-' + type).append([$icon, $text]);
})
.compact();
if (!alerts.size()) return;

22
src/ui/public/vislib/lib/axis_title.js
View file

@ -54,17 +54,17 @@ export default function AxisTitleFactory(Private) {
self.validateWidthandHeight(width, height);
div.append('svg')
.attr('width', width)
.attr('height', height)
.append('text')
.attr('transform', function () {
if (div.attr('class') === 'x-axis-title') {
return 'translate(' + width / 2 + ',11)';
}
return 'translate(11,' + height / 2 + ')rotate(270)';
})
.attr('text-anchor', 'middle')
.text(title);
.attr('width', width)
.attr('height', height)
.append('text')
.attr('transform', function () {
if (div.attr('class') === 'x-axis-title') {
return 'translate(' + width / 2 + ',11)';
}
return 'translate(11,' + height / 2 + ')rotate(270)';
})
.attr('text-anchor', 'middle')
.text(title);
});
};
};

26
src/ui/public/vislib/lib/chart_title.js
View file

@ -105,19 +105,19 @@ export default function ChartTitleFactory(Private) {
self.validateWidthandHeight(width, height);
div.append('svg')
.attr('width', width)
.attr('height', height)
.append('text')
.attr('transform', function () {
if (dataType === 'rows') {
return 'translate(' + txtHtOffset + ',' + height / 2 + ')rotate(270)';
}
return 'translate(' + width / 2 + ',' + txtHtOffset + ')';
})
.attr('text-anchor', 'middle')
.text(function (d) {
return d.label;
});
.attr('width', width)
.attr('height', height)
.append('text')
.attr('transform', function () {
if (dataType === 'rows') {
return 'translate(' + txtHtOffset + ',' + height / 2 + ')rotate(270)';
}
return 'translate(' + width / 2 + ',' + txtHtOffset + ')';
})
.attr('text-anchor', 'middle')
.text(function (d) {
return d.label;
});
// truncate long chart titles
div.selectAll('text')

42
src/ui/public/vislib/lib/data.js
View file

@ -47,16 +47,16 @@ export default function DataFactory(Private) {
this._attr = _.defaults(attr || {}, {
stack: d3.layout.stack()
.x(function (d) {
return d.x;
})
.y(function (d) {
if (offset === 'expand') {
return Math.abs(d.y);
}
return d.y;
})
.offset(offset || 'zero')
.x(function (d) {
return d.x;
})
.y(function (d) {
if (offset === 'expand') {
return Math.abs(d.y);
}
return d.y;
})
.offset(offset || 'zero')
});
if (attr.mode === 'stacked' && attr.type === 'histogram') {
@ -484,10 +484,10 @@ export default function DataFactory(Private) {
}
const points = chart.series
.reduce(function (points, series) {
return points.concat(series.values);
}, [])
.map(getValue);
.reduce(function (points, series) {
return points.concat(series.values);
}, [])
.map(getValue);
return d3[extent](points);
};
@ -557,13 +557,13 @@ export default function DataFactory(Private) {
const namedObj = this.returnNames(slices.children, 0, columns);
return _(namedObj)
.sortBy(function (obj) {
return obj.index;
})
.unique(function (d) {
return d.label;
})
.value();
.sortBy(function (obj) {
return obj.index;
})
.unique(function (d) {
return d.label;
})
.value();
}
};

60
src/ui/public/vislib/lib/dispatch.js
View file

@ -265,43 +265,43 @@ export default function DispatchClass(Private) {
// Brush scale
const brush = d3.svg.brush()
.x(xScale)
.on('brushend', function brushEnd() {
.x(xScale)
.on('brushend', function brushEnd() {
// Assumes data is selected at the chart level
// In this case, the number of data objects should always be 1
const data = d3.select(this).data()[0];
const isTimeSeries = (data.ordered && data.ordered.date);
// Assumes data is selected at the chart level
// In this case, the number of data objects should always be 1
const data = d3.select(this).data()[0];
const isTimeSeries = (data.ordered && data.ordered.date);
// Allows for brushing on d3.scale.ordinal()
const selected = xScale.domain().filter(function (d) {
return (brush.extent()[0] <= xScale(d)) && (xScale(d) <= brush.extent()[1]);
});
const range = isTimeSeries ? brush.extent() : selected;
return self.emit('brush', {
range: range,
config: attr,
e: d3.event,
data: data
});
// Allows for brushing on d3.scale.ordinal()
const selected = xScale.domain().filter(function (d) {
return (brush.extent()[0] <= xScale(d)) && (xScale(d) <= brush.extent()[1]);
});
const range = isTimeSeries ? brush.extent() : selected;
return self.emit('brush', {
range: range,
config: attr,
e: d3.event,
data: data
});
});
// if `addBrushing` is true, add brush canvas
if (self.listenerCount('brush')) {
svg.insert('g', 'g')
.attr('class', 'brush')
.call(brush)
.call(function (brushG) {
// hijack the brush start event to filter out right/middle clicks
const brushHandler = brushG.on('mousedown.brush');
if (!brushHandler) return; // touch events in use
brushG.on('mousedown.brush', function () {
if (validBrushClick(d3.event)) brushHandler.apply(this, arguments);
});
})
.selectAll('rect')
.attr('height', height - margin.top - margin.bottom);
.attr('class', 'brush')
.call(brush)
.call(function (brushG) {
// hijack the brush start event to filter out right/middle clicks
const brushHandler = brushG.on('mousedown.brush');
if (!brushHandler) return; // touch events in use
brushG.on('mousedown.brush', function () {
if (validBrushClick(d3.event)) brushHandler.apply(this, arguments);
});
})
.selectAll('rect')
.attr('height', height - margin.top - margin.bottom);
return brush;
}

34
src/ui/public/vislib/lib/handler/handler.js
View file

@ -117,16 +117,16 @@ export default function HandlerBaseClass(Private) {
// render the chart(s)
selection.selectAll('.chart')
.each(function (chartData) {
const chart = new self.ChartClass(self, this, chartData);
.each(function (chartData) {
const chart = new self.ChartClass(self, this, chartData);
self.vis.activeEvents().forEach(function (event) {
self.enable(event, chart);
});
charts.push(chart);
chart.render();
self.vis.activeEvents().forEach(function (event) {
self.enable(event, chart);
});
charts.push(chart);
chart.render();
});
};
chartEventProxyToggle(method) {
@ -163,18 +163,18 @@ export default function HandlerBaseClass(Private) {
this.removeAll(this.el);
const div = d3.select(this.el)
.append('div')
// class name needs `chart` in it for the polling checkSize function
// to continuously call render on resize
.attr('class', 'visualize-error chart error');
.append('div')
// class name needs `chart` in it for the polling checkSize function
// to continuously call render on resize
.attr('class', 'visualize-error chart error');
if (message === 'No results found') {
div.append('div')
.attr('class', 'text-center visualize-error visualize-chart ng-scope')
.append('div').attr('class', 'item top')
.append('div').attr('class', 'item')
.append('h2').html('<i class="fa fa-meh-o"></i>')
.append('h4').text(message);
.attr('class', 'text-center visualize-error visualize-chart ng-scope')
.append('div').attr('class', 'item top')
.append('div').attr('class', 'item')
.append('h2').html('<i class="fa fa-meh-o"></i>')
.append('h4').text(message);
div.append('div').attr('class', 'item bottom');
return div;

15
src/ui/public/vislib/lib/handler/types/point_series.js
View file

@ -17,6 +17,13 @@ export default function ColumnHandler(Private) {
const ChartTitle = Private(VislibLibChartTitleProvider);
const Alerts = Private(VislibLibAlertsProvider);
function getData(vis, opts) {
if (opts.zeroFill) {
return new Data(injectZeros(vis.data), vis._attr, vis.uiState);
} else {
return new Data(vis.data, vis._attr, vis.uiState);
}
}
/*
* Create handlers for Area, Column, and Line charts which
* are all nearly the same minus a few details
@ -26,13 +33,7 @@ export default function ColumnHandler(Private) {
return function (vis) {
const isUserDefinedYAxis = vis._attr.setYExtents;
let data;
if (opts.zeroFill) {
data = new Data(injectZeros(vis.data), vis._attr, vis.uiState);
} else {
data = new Data(vis.data, vis._attr, vis.uiState);
}
const data = getData(vis, opts);
return new Handler(vis, {
data: data,

4
src/ui/public/vislib/lib/layout/layout.js
View file

@ -131,8 +131,8 @@ export default function LayoutFactory(Private) {
}
return d3.select(el)
.append(type)
.attr('class', className);
.append(type)
.attr('class', className);
};
/**

109
src/ui/public/vislib/lib/x_axis.js
View file

@ -219,10 +219,10 @@ export default function XAxisFactory(Private) {
}
this.xAxis = d3.svg.axis()
.scale(this.xScale)
.ticks(10)
.tickFormat(this.xAxisFormatter)
.orient('bottom');
.scale(this.xScale)
.ticks(10)
.tickFormat(this.xAxisFormatter)
.orient('bottom');
};
/**
@ -238,8 +238,8 @@ export default function XAxisFactory(Private) {
return function (selection) {
const n = selection[0].length;
const parentWidth = $(self.el)
.find('.x-axis-div-wrapper')
.width();
.find('.x-axis-div-wrapper')
.width();
selection.each(function () {
@ -252,13 +252,13 @@ export default function XAxisFactory(Private) {
self.getXAxis(width);
const svg = div.append('svg')
.attr('width', width)
.attr('height', height);
.attr('width', width)
.attr('height', height);
svg.append('g')
.attr('class', 'x axis')
.attr('transform', 'translate(0,0)')
.call(self.xAxis);
.attr('class', 'x axis')
.attr('transform', 'translate(0,0)')
.call(self.xAxis);
});
selection.call(self.filterOrRotate());
@ -329,19 +329,20 @@ export default function XAxisFactory(Private) {
if (self._attr.isRotated) {
text
.text(function truncate() {
return self.truncateLabel(this, self._attr.xAxisLabelHt);
})
.style('text-anchor', 'end')
.attr('dx', '-.8em')
.attr('dy', '-.60em')
.attr('transform', function rotate() {
return 'rotate(-90)';
})
.append('title')
.text(text => text);
.text(function truncate() {
return self.truncateLabel(this, self._attr.xAxisLabelHt);
})
.style('text-anchor', 'end')
.attr('dx', '-.8em')
.attr('dy', '-.60em')
.attr('transform', function rotate() {
return 'rotate(-90)';
})
.append('title')
.text(text => text);
selection.select('svg')
.attr('height', self._attr.xAxisLabelHt);
.attr('height', self._attr.xAxisLabelHt);
}
};
};
@ -395,20 +396,20 @@ export default function XAxisFactory(Private) {
return function (selection) {
selection.selectAll('.tick text')
.text(function (d) {
par = d3.select(this.parentNode).node();
myX = self.xScale(d);
myWidth = par.getBBox().width * padding;
halfWidth = myWidth / 2;
maxW = $(self.el).find('.x-axis-div').width();
.text(function (d) {
par = d3.select(this.parentNode).node();
myX = self.xScale(d);
myWidth = par.getBBox().width * padding;
halfWidth = myWidth / 2;
maxW = $(self.el).find('.x-axis-div').width();
if ((startX + halfWidth) < myX && maxW > (myX + halfWidth)) {
startX = myX + halfWidth;
return self.xAxisFormatter(d);
} else {
d3.select(this.parentNode).remove();
}
});
if ((startX + halfWidth) < myX && maxW > (myX + halfWidth)) {
startX = myX + halfWidth;
return self.xAxisFormatter(d);
} else {
d3.select(this.parentNode).remove();
}
});
};
};
@ -440,16 +441,16 @@ export default function XAxisFactory(Private) {
let titleHeight = yAxisTitle.height();
text = visEl.select('.x-axis-title')
.select('svg')
.attr('width', titleWidth)
.select('text')
.attr('transform', 'translate(' + (titleWidth / 2) + ',11)');
.select('svg')
.attr('width', titleWidth)
.select('text')
.attr('transform', 'translate(' + (titleWidth / 2) + ',11)');
text = visEl.select('.y-axis-title')
.select('svg')
.attr('height', titleHeight)
.select('text')
.attr('transform', 'translate(11,' + (titleHeight / 2) + ')rotate(-90)');
.select('svg')
.attr('height', titleHeight)
.select('text')
.attr('transform', 'translate(11,' + (titleHeight / 2) + ')rotate(-90)');
if ($visEl.find('.x-axis-chart-title').length) {
xAxisChartTitle = $visEl.find('.x-axis-chart-title');
@ -458,10 +459,10 @@ export default function XAxisFactory(Private) {
titles = visEl.select('.x-axis-chart-title').selectAll('.chart-title');
titles.each(function () {
text = d3.select(this)
.select('svg')
.attr('width', titleWidth)
.select('text')
.attr('transform', 'translate(' + (titleWidth / 2) + ',11)');
.select('svg')
.attr('width', titleWidth)
.select('text')
.attr('transform', 'translate(' + (titleWidth / 2) + ',11)');
});
}
@ -472,10 +473,10 @@ export default function XAxisFactory(Private) {
titles = visEl.select('.y-axis-chart-title').selectAll('.chart-title');
titles.each(function () {
text = d3.select(this)
.select('svg')
.attr('height', titleHeight)
.select('text')
.attr('transform', 'translate(11,' + (titleHeight / 2) + ')rotate(-90)');
.select('svg')
.attr('height', titleHeight)
.select('text')
.attr('transform', 'translate(11,' + (titleHeight / 2) + ')rotate(-90)');
});
}
@ -498,8 +499,8 @@ export default function XAxisFactory(Private) {
if (visEl.select('.inner-spacer-block').node() === null) {
visEl.select('.y-axis-spacer-block')
.append('div')
.attr('class', 'inner-spacer-block');
.append('div')
.attr('class', 'inner-spacer-block');
}
const xAxisHt = visEl.select('.x-axis-wrapper').style('height');

30
src/ui/public/vislib/lib/y_axis.js
View file

@ -117,8 +117,8 @@ export default function YAxisFactory(Private) {
const domain = this._getExtents(this.domain);
this.yScale = scale
.domain(domain)
.range([height, 0]);
.domain(domain)
.range([height, 0]);
if (!this._isUserDefined()) this.yScale.nice(); // round extents when not user defined
// Prevents bars from going off the chart when the y extents are within the domain range
@ -154,10 +154,10 @@ export default function YAxisFactory(Private) {
// Create the d3 yAxis function
this.yAxis = d3.svg.axis()
.scale(yScale)
.tickFormat(this.tickFormat(this.domain))
.ticks(this.tickScale(height))
.orient('left');
.scale(yScale)
.tickFormat(this.tickFormat(this.domain))
.ticks(this.tickScale(height))
.orient('left');
return this.yAxis;
};
@ -174,9 +174,9 @@ export default function YAxisFactory(Private) {
*/
tickScale(height) {
const yTickScale = d3.scale.linear()
.clamp(true)
.domain([20, 40, 1000])
.range([0, 3, 11]);
.clamp(true)
.domain([20, 40, 1000])
.range([0, 3, 11]);
return Math.ceil(yTickScale(height));
};
@ -211,20 +211,20 @@ export default function YAxisFactory(Private) {
if (!isWiggleOrSilhouette) {
// Append svg and y axis
const svg = div.append('svg')
.attr('width', width)
.attr('height', height);
.attr('width', width)
.attr('height', height);
svg.append('g')
.attr('class', 'y axis')
.attr('transform', 'translate(' + (width - 2) + ',' + margin.top + ')')
.call(yAxis);
.attr('class', 'y axis')
.attr('transform', 'translate(' + (width - 2) + ',' + margin.top + ')')
.call(yAxis);
const container = svg.select('g.y.axis').node();
if (container) {
const cWidth = Math.max(width, container.getBBox().width);
svg.attr('width', cWidth);
svg.select('g')
.attr('transform', 'translate(' + (cWidth - 2) + ',' + margin.top + ')');
.attr('transform', 'translate(' + (cWidth - 2) + ',' + margin.top + ')');
}
}
});

28
src/ui/public/vislib/visualizations/_point_series_chart.js
View file

@ -123,20 +123,20 @@ export default function PointSeriesChartProvider(Private) {
};
this.endzones = svg.selectAll('.layer')
.data([leftEndzone, rightEndzone])
.enter()
.insert('g', '.brush')
.attr('class', 'endzone')
.append('rect')
.attr('class', 'zone')
.attr('x', function (d) {
return d.x;
})
.attr('y', 0)
.attr('height', height - margin.top - margin.bottom)
.attr('width', function (d) {
return d.w;
});
.data([leftEndzone, rightEndzone])
.enter()
.insert('g', '.brush')
.attr('class', 'endzone')
.append('rect')
.attr('class', 'zone')
.attr('x', function (d) {
return d.x;
})
.attr('y', 0)
.attr('height', height - margin.top - margin.bottom)
.attr('width', function (d) {
return d.w;
});
function callPlay(event) {
const boundData = event.target.__data__;

112
src/ui/public/vislib/visualizations/area_chart.js
View file

@ -177,49 +177,49 @@ export default function AreaChartFactory(Private) {
const isOverlapping = this.isOverlapping;
const layer = svg.selectAll('.points')
.data(data)
.enter()
.append('g')
.attr('class', 'points area');
.data(data)
.enter()
.append('g')
.attr('class', 'points area');
// append the circles
const circles = layer
.selectAll('circles')
.data(function appendData(data) {
return data.filter(function isZeroOrNull(d) {
return d.y !== 0 && !_.isNull(d.y);
});
.selectAll('circles')
.data(function appendData(data) {
return data.filter(function isZeroOrNull(d) {
return d.y !== 0 && !_.isNull(d.y);
});
});
// exit
circles.exit().remove();
// enter
circles
.enter()
.append('circle')
.call(this._addIdentifier)
.attr('stroke', function strokeColor(d) {
return color(d.label);
})
.attr('fill', 'transparent')
.attr('stroke-width', circleStrokeWidth);
.enter()
.append('circle')
.call(this._addIdentifier)
.attr('stroke', function strokeColor(d) {
return color(d.label);
})
.attr('fill', 'transparent')
.attr('stroke-width', circleStrokeWidth);
// update
circles
.attr('cx', function cx(d) {
if (ordered && ordered.date) {
return xScale(d.x);
}
return xScale(d.x) + xScale.rangeBand() / 2;
})
.attr('cy', function cy(d) {
if (isOverlapping) {
return yScale(d.y);
}
return yScale(d.y0 + d.y);
})
.attr('r', circleRadius);
.attr('cx', function cx(d) {
if (ordered && ordered.date) {
return xScale(d.x);
}
return xScale(d.x) + xScale.rangeBand() / 2;
})
.attr('cy', function cy(d) {
if (isOverlapping) {
return yScale(d.y);
}
return yScale(d.y0 + d.y);
})
.attr('r', circleRadius);
// Add tooltip
if (isTooltip) {
@ -246,14 +246,14 @@ export default function AreaChartFactory(Private) {
// Creating clipPath
return svg
.attr('clip-path', 'url(#' + id + ')')
.append('clipPath')
.attr('id', id)
.append('rect')
.attr('x', startX)
.attr('y', startY)
.attr('width', width)
.attr('height', height);
.attr('clip-path', 'url(#' + id + ')')
.append('clipPath')
.attr('id', id)
.append('rect')
.attr('x', startX)
.attr('y', startY)
.attr('width', width)
.attr('height', height);
};
checkIfEnoughData() {
@ -322,10 +322,10 @@ export default function AreaChartFactory(Private) {
// Create the canvas for the visualization
const svg = div.append('svg')
.attr('width', width)
.attr('height', height + margin.top + margin.bottom)
.append('g')
.attr('transform', 'translate(0,' + margin.top + ')');
.attr('width', width)
.attr('height', height + margin.top + margin.bottom)
.append('g')
.attr('transform', 'translate(0,' + margin.top + ')');
// add clipPath to hide circles when they go out of bounds
self.addClipPath(svg, width, height);
@ -338,13 +338,13 @@ export default function AreaChartFactory(Private) {
// Draw line at yScale 0 value
svg.append('line')
.attr('class', 'zero-line')
.attr('x1', 0)
.attr('y1', yScale(0))
.attr('x2', width)
.attr('y2', yScale(0))
.style('stroke', '#ddd')
.style('stroke-width', 1);
.attr('class', 'zero-line')
.attr('x1', 0)
.attr('y1', yScale(0))
.attr('x2', width)
.attr('y2', yScale(0))
.style('stroke', '#ddd')
.style('stroke-width', 1);
}
// add circles
@ -355,13 +355,13 @@ export default function AreaChartFactory(Private) {
// chart base line
svg.append('line')
.attr('class', 'base-line')
.attr('x1', 0)
.attr('y1', yScale(0))
.attr('x2', width)
.attr('y2', yScale(0))
.style('stroke', '#ddd')
.style('stroke-width', 1);
.attr('class', 'base-line')
.attr('x1', 0)
.attr('y1', yScale(0))
.attr('x2', width)
.attr('y2', yScale(0))
.style('stroke', '#ddd')
.style('stroke-width', 1);
if (addTimeMarker) {
timeMarker.render(svg);

22
src/ui/public/vislib/visualizations/column_chart.js
View file

@ -291,10 +291,10 @@ export default function ColumnChartFactory(Private) {
const div = d3.select(this);
const svg = div.append('svg')
.attr('width', width)
.attr('height', height + margin.top + margin.bottom)
.append('g')
.attr('transform', 'translate(0,' + margin.top + ')');
.attr('width', width)
.attr('height', height + margin.top + margin.bottom)
.append('g')
.attr('transform', 'translate(0,' + margin.top + ')');
const bars = self.addBars(svg, layers);
self.createEndZones(svg);
@ -303,13 +303,13 @@ export default function ColumnChartFactory(Private) {
self.addBarEvents(bars, svg);
svg.append('line')
.attr('class', 'base-line')
.attr('x1', 0)
.attr('y1', yScale(0))
.attr('x2', width)
.attr('y2', yScale(0))
.style('stroke', '#ddd')
.style('stroke-width', 1);
.attr('class', 'base-line')
.attr('x1', 0)
.attr('y1', yScale(0))
.attr('x2', width)
.attr('y2', yScale(0))
.style('stroke', '#ddd')
.style('stroke-width', 1);
if (addTimeMarker) {
timeMarker.render(svg);

155
src/ui/public/vislib/visualizations/line_chart.js
View file

@ -77,38 +77,38 @@ export default function LineChartFactory(Private) {
const isTooltip = this._attr.addTooltip;
const radii = _(data)
.map(function (series) {
return _.pluck(series, '_input.z');
})
.flattenDeep()
.reduce(function (result, val) {
if (result.min > val) result.min = val;
if (result.max < val) result.max = val;
return result;
}, {
min: Infinity,
max: -Infinity
});
.map(function (series) {
return _.pluck(series, '_input.z');
})
.flattenDeep()
.reduce(function (result, val) {
if (result.min > val) result.min = val;
if (result.max < val) result.max = val;
return result;
}, {
min: Infinity,
max: -Infinity
});
const radiusStep = ((radii.max - radii.min) || (radii.max * 100)) / Math.pow(this._attr.radiusRatio, 2);
const layer = svg.selectAll('.points')
.data(data)
.enter()
.append('g')
.attr('class', 'points line');
.data(data)
.enter()
.append('g')
.attr('class', 'points line');
const circles = layer
.selectAll('circle')
.data(function appendData(data) {
return data.filter(function (d) {
return !_.isNull(d.y);
});
.selectAll('circle')
.data(function appendData(data) {
return data.filter(function (d) {
return !_.isNull(d.y);
});
});
circles
.exit()
.remove();
.exit()
.remove();
function cx(d) {
if (ordered && ordered.date) {
@ -148,27 +148,27 @@ export default function LineChartFactory(Private) {
circles
.enter()
.append('circle')
.attr('r', getCircleRadiusFn())
.attr('fill-opacity', (this._attr.drawLinesBetweenPoints ? 1 : 0.7))
.attr('cx', cx)
.attr('cy', cy)
.attr('class', 'circle-decoration')
.call(this._addIdentifier)
.attr('fill', colorCircle);
.enter()
.append('circle')
.attr('r', getCircleRadiusFn())
.attr('fill-opacity', (this._attr.drawLinesBetweenPoints ? 1 : 0.7))
.attr('cx', cx)
.attr('cy', cy)
.attr('class', 'circle-decoration')
.call(this._addIdentifier)
.attr('fill', colorCircle);
circles
.enter()
.append('circle')
.attr('r', getCircleRadiusFn(10))
.attr('cx', cx)
.attr('cy', cy)
.attr('fill', 'transparent')
.attr('class', 'circle')
.call(this._addIdentifier)
.attr('stroke', cColor)
.attr('stroke-width', 0);
.enter()
.append('circle')
.attr('r', getCircleRadiusFn(10))
.attr('cx', cx)
.attr('cy', cy)
.attr('fill', 'transparent')
.attr('class', 'circle')
.call(this._addIdentifier)
.attr('stroke', cColor)
.attr('stroke-width', 0);
if (isTooltip) {
circles.call(tooltip.render());
@ -194,22 +194,21 @@ export default function LineChartFactory(Private) {
const ordered = this.handler.data.get('ordered');
const interpolate = (this._attr.smoothLines) ? 'cardinal' : this._attr.interpolate;
const line = d3.svg.line()
.defined(function (d) {
return !_.isNull(d.y);
})
.interpolate(interpolate)
.x(function x(d) {
if (ordered && ordered.date) {
return xScale(d.x);
}
return xScale(d.x) + xScale.rangeBand() / 2;
})
.y(function y(d) {
return yScale(d.y);
});
let lines;
.defined(function (d) {
return !_.isNull(d.y);
})
.interpolate(interpolate)
.x(function x(d) {
if (ordered && ordered.date) {
return xScale(d.x);
}
return xScale(d.x) + xScale.rangeBand() / 2;
})
.y(function y(d) {
return yScale(d.y);
});
lines = svg
const lines = svg
.selectAll('.lines')
.data(data)
.enter()
@ -246,16 +245,16 @@ export default function LineChartFactory(Private) {
const id = 'chart-area' + _.uniqueId();
return svg
.attr('clip-path', 'url(#' + id + ')')
.append('clipPath')
.attr('id', id)
.append('rect')
.attr('x', startX)
.attr('y', startY)
.attr('width', width)
// Adding clipPathBuffer to height so it doesn't
// cutoff the lower part of the chart
.attr('height', height + clipPathBuffer);
.attr('clip-path', 'url(#' + id + ')')
.append('clipPath')
.attr('id', id)
.append('rect')
.attr('x', startX)
.attr('y', startY)
.attr('width', width)
// Adding clipPathBuffer to height so it doesn't
// cutoff the lower part of the chart
.attr('height', height + clipPathBuffer);
};
/**
@ -313,10 +312,10 @@ export default function LineChartFactory(Private) {
const div = d3.select(el);
const svg = div.append('svg')
.attr('width', width + margin.left + margin.right)
.attr('height', height + margin.top + margin.bottom)
.append('g')
.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
.attr('width', width + margin.left + margin.right)
.attr('height', height + margin.top + margin.bottom)
.append('g')
.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
self.addClipPath(svg, width, height);
if (self._attr.drawLinesBetweenPoints) {
@ -329,13 +328,13 @@ export default function LineChartFactory(Private) {
const scale = (scaleType === 'log') ? yScale(1) : yScale(0);
if (scale) {
svg.append('line')
.attr('class', 'base-line')
.attr('x1', startLineX)
.attr('y1', scale)
.attr('x2', width)
.attr('y2', scale)
.style('stroke', '#ddd')
.style('stroke-width', lineStrokeWidth);
.attr('class', 'base-line')
.attr('x1', startLineX)
.attr('y1', scale)
.attr('x2', width)
.attr('y2', scale)
.style('stroke', '#ddd')
.style('stroke-width', lineStrokeWidth);
}
if (addTimeMarker) {

12
src/ui/public/vislib/visualizations/marker_types/base_marker.js
View file

@ -48,9 +48,9 @@ export default function MarkerFactory() {
_.each(self._legendColors, function (color, i) {
const labelText = self._legendQuantizer
.invertExtent(color)
.map(self._valueFormatter)
.join(' – ');
.invertExtent(color)
.map(self._valueFormatter)
.join(' – ');
const label = $('<div>').text(labelText);
@ -216,9 +216,9 @@ export default function MarkerFactory() {
_createTooltip(content, latLng) {
L.popup({autoPan: false})
.setLatLng(latLng)
.setContent(content)
.openOn(this.map);
.setLatLng(latLng)
.setContent(content)
.openOn(this.map);
};
/**

100
src/ui/public/vislib/visualizations/pie_chart.js
View file

@ -54,9 +54,9 @@ export default function PieChartFactory(Private) {
const events = this.events;
return element
.call(events.addHoverEvent())
.call(events.addMouseoutEvent())
.call(events.addClickEvent());
.call(events.addHoverEvent())
.call(events.addMouseoutEvent())
.call(events.addClickEvent());
};
convertToPercentage(slices) {
@ -106,55 +106,55 @@ export default function PieChartFactory(Private) {
const isTooltip = self._attr.addTooltip;
const partition = d3.layout.partition()
.sort(null)
.value(function (d) {
return d.percentOfParent * 100;
});
.sort(null)
.value(function (d) {
return d.percentOfParent * 100;
});
const x = d3.scale.linear()
.range([0, 2 * Math.PI]);
.range([0, 2 * Math.PI]);
const y = d3.scale.sqrt()
.range([0, radius]);
.range([0, radius]);
const arc = d3.svg.arc()
.startAngle(function (d) {
return Math.max(0, Math.min(2 * Math.PI, x(d.x)));
})
.endAngle(function (d) {
return Math.max(0, Math.min(2 * Math.PI, x(d.x + d.dx)));
})
.innerRadius(function (d) {
// option for a single layer, i.e pie chart
if (d.depth === 1 && !isDonut) {
// return no inner radius
return 0;
}
.startAngle(function (d) {
return Math.max(0, Math.min(2 * Math.PI, x(d.x)));
})
.endAngle(function (d) {
return Math.max(0, Math.min(2 * Math.PI, x(d.x + d.dx)));
})
.innerRadius(function (d) {
// option for a single layer, i.e pie chart
if (d.depth === 1 && !isDonut) {
// return no inner radius
return 0;
}
return Math.max(0, y(d.y));
})
.outerRadius(function (d) {
return Math.max(0, y(d.y + d.dy));
});
return Math.max(0, y(d.y));
})
.outerRadius(function (d) {
return Math.max(0, y(d.y + d.dy));
});
const path = svg
.datum(slices)
.selectAll('path')
.data(partition.nodes)
.enter()
.append('path')
.attr('d', arc)
.attr('class', function (d) {
if (d.depth === 0) {
return;
}
return 'slice';
})
.call(self._addIdentifier, 'name')
.style('stroke', '#fff')
.style('fill', function (d) {
if (d.depth === 0) {
return 'none';
}
return color(d.name);
});
.datum(slices)
.selectAll('path')
.data(partition.nodes)
.enter()
.append('path')
.attr('d', arc)
.attr('class', function (d) {
if (d.depth === 0) {
return;
}
return 'slice';
})
.call(self._addIdentifier, 'name')
.style('stroke', '#fff')
.style('fill', function (d) {
if (d.depth === 0) {
return 'none';
}
return color(d.name);
});
if (isTooltip) {
path.call(tooltip.render());
@ -194,10 +194,10 @@ export default function PieChartFactory(Private) {
self._validateContainerSize(width, height);
const svg = div.append('svg')
.attr('width', width)
.attr('height', height)
.append('g')
.attr('transform', 'translate(' + width / 2 + ',' + height / 2 + ')');
.attr('width', width)
.attr('height', height)
.append('g')
.attr('transform', 'translate(' + width / 2 + ',' + height / 2 + ')');
const path = self.addPath(width, height, svg, slices);
self.addPathEvents(path);

46
src/ui/public/vislib/visualizations/time_marker.js
View file

@ -40,29 +40,29 @@ export default function TimeMarkerFactory() {
selection.each(function () {
d3.select(this).selectAll('time-marker')
.data(self.times)
.enter().append('line')
.attr('class', function (d) {
return d.class;
})
.attr('pointer-events', 'none')
.attr('stroke', function (d) {
return d.color;
})
.attr('stroke-width', function (d) {
return d.width;
})
.attr('stroke-opacity', function (d) {
return d.opacity;
})
.attr('x1', function (d) {
return self.xScale(d.time);
})
.attr('x2', function (d) {
return self.xScale(d.time);
})
.attr('y1', self.height)
.attr('y2', self.xScale.range()[0]);
.data(self.times)
.enter().append('line')
.attr('class', function (d) {
return d.class;
})
.attr('pointer-events', 'none')
.attr('stroke', function (d) {
return d.color;
})
.attr('stroke-width', function (d) {
return d.width;
})
.attr('stroke-opacity', function (d) {
return d.opacity;
})
.attr('x1', function (d) {
return self.xScale(d.time);
})
.attr('x2', function (d) {
return self.xScale(d.time);
})
.attr('y1', self.height)
.attr('y2', self.xScale.range()[0]);
});
};
}