cleaning up

This commit is contained in:
ppisljar 2016-12-25 22:06:32 +01:00
parent d2168d7c22
commit 3d90a32138
11 changed files with 47 additions and 34 deletions

View file

@ -17,8 +17,7 @@ export default function PointSeriesVisType(Private) {
params: {
defaults: {
grid: {
show: false,
categoryLines: true,
categoryLines: false,
style: {
color: '#eee'
}
@ -73,7 +72,6 @@ export default function PointSeriesVisType(Private) {
addLegend: true,
legendPosition: 'right',
showCircles: true,
smoothLines: false,
interpolate: 'linear',
scale: 'linear',
drawLinesBetweenPoints: true,

View file

@ -13,12 +13,6 @@
Grid
</span>
</div>
<input
aria-label="enable"
ng-model="vis.params.grid.show"
type="checkbox"
class="kuiSideBarSectionTitle__action"
>
</div>
<div ng-show="isGridOpen" class="kuiSideBarCollapsibleSection">

View file

@ -81,11 +81,17 @@
<div ng-show="chart.type == 'line' || chart.type == 'area'">
<div class="kuiSideBarFormRow">
<label class="kuiSideBarFormRow__label" for="{{ 'smoothLine' + $index }}">
Smooth lines
<label class="kuiSideBarFormRow__label" for="{{ 'lineMode' + $index }}">
Line Mode
</label>
<div class="kuiSideBarFormRow__control">
<input class="kuiCheckBox" id="{{ 'smoothLine' + $index }}" type="checkbox" ng-model="chart.smoothLines">
<select
id="{{ 'lineMode' + $index }}"
class="kuiSelect kuiSideBarSelect"
ng-model="chart.interpolate"
ng-options="mode.value as mode.text for mode in vis.type.params.interpolationModes"
>
</select>
</div>
</div>
</div>

View file

@ -15,8 +15,7 @@ export default function PointSeriesVisType(Private) {
params: {
defaults: {
grid: {
show: false,
categoryLines: true,
categoryLines: false,
style: {
color: '#eee'
}
@ -73,7 +72,6 @@ export default function PointSeriesVisType(Private) {
addLegend: true,
legendPosition: 'right',
showCircles: true,
smoothLines: false,
interpolate: 'linear',
scale: 'linear',
drawLinesBetweenPoints: true,
@ -88,6 +86,16 @@ export default function PointSeriesVisType(Private) {
axisModes: ['normal', 'percentage', 'wiggle', 'silhouette'],
scaleTypes: ['linear', 'log', 'square root'],
chartModes: ['normal', 'stacked'],
interpolationModes: [{
value: 'linear',
text: 'straight',
}, {
value: 'cardinal',
text: 'smoothed',
}, {
value: 'step-after',
text: 'stepped',
}],
editor: pointSeriesTemplate
},
schemas: new Schemas([

View file

@ -7,15 +7,14 @@ export default function PointSeriesVisType(Private) {
const Schemas = Private(VisSchemasProvider);
return new VislibVisType({
name: 'point_series',
name: 'horizontal_bar',
title: 'Horizontal bar chart',
icon: 'fa-bars',
description: 'Like histogram chart but with horizontal bars.',
params: {
defaults: {
grid: {
show: false,
categoryLines: true,
categoryLines: false,
color: '#eee'
},
categoryAxes: [
@ -71,7 +70,6 @@ export default function PointSeriesVisType(Private) {
addLegend: true,
legendPosition: 'right',
showCircles: true,
smoothLines: false,
interpolate: 'linear',
scale: 'linear',
drawLinesBetweenPoints: true,
@ -86,6 +84,16 @@ export default function PointSeriesVisType(Private) {
axisModes: ['normal', 'percentage', 'wiggle', 'silhouette'],
scaleTypes: ['linear', 'log', 'square root'],
chartModes: ['normal', 'stacked'],
interpolationModes: [{
value: 'linear',
text: 'straight',
}, {
value: 'cardinal',
text: 'smoothed',
}, {
value: 'step-after',
text: 'stepped',
}],
editor: pointSeriesTemplate
},
schemas: new Schemas([

View file

@ -6,7 +6,7 @@ import pieVisTypeProvider from 'plugins/kbn_vislib_vis_types/pie';
import areaVisTypeProvider from 'plugins/kbn_vislib_vis_types/area';
import tileMapVisTypeProvider from 'plugins/kbn_vislib_vis_types/tile_map';
import heatmapVisTypeProvider from 'plugins/kbn_vislib_vis_types/heatmap';
import pointSeriesVisTypeProvider from 'plugins/kbn_vislib_vis_types/point_series';
import horizontalBarVisTypeProvider from 'plugins/kbn_vislib_vis_types/horizontal_bar';
visTypes.register(histogramVisTypeProvider);
visTypes.register(lineVisTypeProvider);
@ -14,4 +14,4 @@ visTypes.register(pieVisTypeProvider);
visTypes.register(areaVisTypeProvider);
visTypes.register(tileMapVisTypeProvider);
visTypes.register(heatmapVisTypeProvider);
visTypes.register(pointSeriesVisTypeProvider);
visTypes.register(horizontalBarVisTypeProvider);

View file

@ -15,8 +15,7 @@ export default function PointSeriesVisType(Private) {
params: {
defaults: {
grid: {
show: false,
categoryLines: true,
categoryLines: false,
style: {
color: '#eee'
}

View file

@ -77,10 +77,10 @@ export default function AxisConfigFactory() {
const typeDefaults = axisConfigArgs.type === 'category' ? categoryDefaults : valueDefaults;
// _.defaultsDeep mutates axisConfigArgs nested values so we clone it first
const axisConfigArgsClone = _.cloneDeep(axisConfigArgs);
const isHorizontal = (axisConfigArgsClone.position &&
['top', 'bottom'].includes(axisConfigArgsClone.position)) ||
axisConfigArgsClone.type === 'category';
_.merge(typeDefaults, isHorizontal ? horizontalDefaults : verticalDefaults);
const isCategoryAxis = axisConfigArgsClone.type === 'category';
const isHorizontal = axisConfigArgsClone.position && ['top', 'bottom'].includes(axisConfigArgsClone.position);
_.merge(typeDefaults, isHorizontal || isCategoryAxis ? horizontalDefaults : verticalDefaults);
this._values = _.defaultsDeep({}, axisConfigArgsClone, typeDefaults, defaults);
this._values.elSelector = this._values.elSelector.replace('{pos}', this._values.position);

View file

@ -27,6 +27,7 @@ export default function AxisTitleFactory(Private) {
const div = d3.select(el);
const width = $(el).width();
const height = $(el).height();
const titlePadding = 15;
const svg = div.append('svg')
.attr('width', width)
@ -35,9 +36,9 @@ export default function AxisTitleFactory(Private) {
const bbox = svg.append('text')
.attr('transform', function () {
if (config.isHorizontal()) {
return 'translate(' + width / 2 + ',15)';
return `translate(${width / 2},${titlePadding})`;
}
return 'translate(15,' + height / 2 + ') rotate(270)';
return `translate(${titlePadding},${height / 2}) rotate(270)`;
})
.attr('text-anchor', 'middle')
.text(config.get('title.text'))

View file

@ -6,8 +6,7 @@ export default function ChartTitleFactory(Private) {
style: {
color: '#eee'
},
show: false,
categoryLines: true,
categoryLines: false,
valueAxis: undefined,
};
@ -54,7 +53,7 @@ export default function ChartTitleFactory(Private) {
draw(width, height) {
const self = this;
return function (selection) {
if (!self._values || !self.get('show')) return;
if (!self._values) return;
selection.each(function () {
if (self.get('categoryLines')) self.drawCategoryLines(d3.select(this), width, height);
if (self.get('valueAxis', false)) self.drawValueLines(d3.select(this), width, height);

View file

@ -10,7 +10,7 @@ export default function ColumnHandler(Private) {
}) : null;
let interpolate = cfg.interpolate;
let interpolate = matchingSeriParams ? matchingSeriParams.interpolate : cfg.interpolate;
// for backward compatibility when loading URLs or configs we need to check smoothLines
if (cfg.smoothLines) interpolate = 'cardinal';
@ -32,8 +32,8 @@ export default function ColumnHandler(Private) {
show: matchingSeriParams.show,
type: matchingSeriParams.type,
mode: matchingSeriParams.mode,
interpolate: interpolate,
valueAxis: matchingSeriParams.valueAxis,
smoothLines: matchingSeriParams.smoothLines,
drawLinesBetweenPoints: matchingSeriParams.drawLinesBetweenPoints,
showCircles: matchingSeriParams.showCircles,
radiusRatio: matchingSeriParams.radiusRatio,