github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-24 01:38:56 -04:00
Code Issues Projects Releases Packages Wiki Activity

updating based on last UI review

Browse source
This commit is contained in:
ppisljar 2017-01-20 13:47:02 +01:00
parent 8544079ffb
commit e9de4f75b1
8 changed files with 73 additions and 43 deletions
Download patch file Download diff file Expand all files Collapse all files

29
src/core_plugins/kbn_vislib_vis_types/public/area.js
View file

@ -34,7 +34,8 @@ export default function PointSeriesVisType(Private) {
type: 'linear'
},
labels: {
show: true
show: true,
truncate: 100
},
title: {}
}
@ -42,6 +43,7 @@ export default function PointSeriesVisType(Private) {
valueAxes: [
{
id: 'ValueAxis-1',
name: 'LeftAxis-1',
type: 'value',
position: 'left',
show: true,
@ -60,7 +62,18 @@ export default function PointSeriesVisType(Private) {
title: {}
}
],
seriesParams: [],
seriesParams: [{
show: 'true',
type: 'area',
mode: 'stacked',
data: {
label: 'Count'
},
drawLinesBetweenPoints: true,
showCircles: true,
interpolate: 'linear',
valueAxis: 'ValueAxis-1'
}],
addTooltip: true,
addLegend: true,
legendPosition: 'right',
@ -91,13 +104,13 @@ export default function PointSeriesVisType(Private) {
}],
editor: pointSeriesTemplate,
optionTabs: [
{ name: 'series', title: 'Series', editor: '<vislib-series></vislib-series>' },
{
name: 'axes',
title: 'Axes',
editor: '<div><vislib-value-axes></vislib-value-axes><vislib-category-axis></vislib-category-axis></div>'
},
{ name: 'options', title: 'Settings', editor: pointSeriesTemplate },
{
name: 'advanced',
title: 'Advanced',
editor: '<div><vislib-series></vislib-series><vislib-value-axes>' +
'</vislib-value-axes><vislib-category-axis></vislib-category-axis></div>'
},
],
},
schemas: new Schemas([

6
src/core_plugins/kbn_vislib_vis_types/public/controls/point_series/grid.html
View file

@ -20,7 +20,7 @@
<div class="kuiSideBarSection">
<div class="kuiSideBarFormRow">
<label class="kuiSideBarFormRow__label" for="showCategoryLines">
Category Lines
X-Axis Lines
</label>
<div class="kuiSideBarFormRow__control">
<input class="kuiCheckBox" id="showCategoryLines" type="checkbox" ng-model="vis.params.grid.categoryLines">
@ -29,14 +29,14 @@
<div class="kuiSideBarFormRow">
<label class="kuiSideBarFormRow__label" for="gridAxis">
Value Axis Lines
Y-Axis Lines
</label>
<div class="kuiSideBarFormRow__control">
<select
id="gridAxis"
class="kuiSelect kuiSideBarSelect"
ng-model="vis.params.grid.valueAxis"
ng-options="axis.id as axis.id for axis in vis.params.valueAxes"
ng-options="axis.id as axis.name for axis in vis.params.valueAxes"
>
<option value="">Don't show</option>
</select>

18
src/core_plugins/kbn_vislib_vis_types/public/controls/point_series/grid.js
View file

@ -9,26 +9,8 @@ module.directive('vislibGrid', function ($parse, $compile) {
template: vislibGridTemplate,
replace: true,
link: function ($scope) {
function mapPosition(position) {
switch (position) {
case 'bottom': return 'left';
case 'top': return 'right';
case 'left': return 'bottom';
case 'right': return 'top';
}
}
$scope.isGridOpen = true;
$scope.$watch('vis.params.categoryAxes[0].position', position => {
const categoryAxisIsHorizontal = ['top', 'bottom'].includes(position);
$scope.vis.params.valueAxes.forEach(axis => {
const axisIsHorizontal = ['top', 'bottom'].includes(axis.position);
if (axisIsHorizontal === categoryAxisIsHorizontal) {
axis.position = mapPosition(axis.position);
}
});
});
}
};
});

16
src/core_plugins/kbn_vislib_vis_types/public/controls/point_series/series.html
View file

@ -1,7 +1,7 @@
<div class="kuiSideBarSection">
<div class="kuiSideBarSectionTitle">
<div class="kuiSideBarSectionTitle__text">
Series
Metrics
</div>
</div>
@ -28,14 +28,6 @@
<div ng-show="isSeriesOpen" class="kuiSideBarCollapsibleSection">
<!-- General -->
<div class="kuiSideBarSection">
<div class="kuiSideBarFormRow">
<label class="kuiSideBarFormRow__label" for="showCursor">
Show
</label>
<div class="kuiSideBarFormRow__control">
<input class="kuiCheckBox" id="showCursor" type="checkbox" ng-model="chart.show">
</div>
</div>
<div class="kuiSideBarFormRow">
<label class="kuiSideBarFormRow__label" for="{{ 'seriesType' + $index }}">
@ -76,8 +68,8 @@
ng-model="chart.valueAxis"
ng-change="changeValueAxis($index)"
>
<option ng-repeat="axis in vis.params.valueAxes track by axis.id">{{axis.id}}</option>
<option value="new">New Axis ...</option>
<option ng-repeat="axis in vis.params.valueAxes track by axis.id" value="{{axis.id}}">{{axis.name}}</option>
</select>
</div>
</div>
@ -121,4 +113,6 @@
</div>
</div>
</div>
<div style="height: 10px"></div>
</div>

5
src/core_plugins/kbn_vislib_vis_types/public/controls/point_series/value_axes.html
View file

@ -29,7 +29,7 @@
class="fa fa-caret-right kuiSideBarCollapsibleTitle__caret"
></span>
<span class="kuiSideBarCollapsibleTitle__text">
{{axis.id}}
{{axis.name}}
</span>
</div>
@ -80,6 +80,7 @@
<select
id="{{ 'valueAxisPosition' + $index }}"
class="kuiSelect kuiSideBarSelect"
ng-change="updateAxisName(axis)"
ng-model="axis.position"
ng-options="mode disable when isPositionDisabled(mode) for mode in vis.type.params.positions"
></select>
@ -262,4 +263,6 @@
</div>
</div>
</div>
<div style="height: 10px"></div>
</div>

34
src/core_plugins/kbn_vislib_vis_types/public/controls/point_series/value_axes.js
View file

@ -20,6 +20,15 @@ module.directive('vislibValueAxes', function ($parse, $compile) {
}
}
function mapPositionOposite(position) {
switch (position) {
case 'bottom': return 'top';
case 'top': return 'bottom';
case 'left': return 'right';
case 'right': return 'left';
}
}
$scope.rotateOptions = [
{ name: 'horizontal', value: 0 },
{ name: 'vertical', value: 90 },
@ -32,6 +41,7 @@ module.directive('vislibValueAxes', function ($parse, $compile) {
const axisIsHorizontal = ['top', 'bottom'].includes(axis.position);
if (axisIsHorizontal === isCategoryAxisHorizontal) {
axis.position = mapPosition(axis.position);
$scope.updateAxisName(axis);
}
});
});
@ -57,7 +67,8 @@ module.directive('vislibValueAxes', function ($parse, $compile) {
};
$scope.addValueAxis = function () {
const newAxis = _.cloneDeep($scope.vis.params.valueAxes[0]);
const firstAxis = $scope.vis.params.valueAxes[0];
const newAxis = _.cloneDeep(firstAxis);
newAxis.id = 'ValueAxis-' + $scope.vis.params.valueAxes.reduce((value, axis) => {
if (axis.id.substr(0, 10) === 'ValueAxis-') {
const num = parseInt(axis.id.substr(10));
@ -66,6 +77,16 @@ module.directive('vislibValueAxes', function ($parse, $compile) {
return value;
}, 1);
newAxis.position = mapPositionOposite(firstAxis.position);
const axisName = _.capitalize(newAxis.position) + 'Axis-';
newAxis.name = axisName + $scope.vis.params.valueAxes.reduce((value, axis) => {
if (axis.name.substr(0, axisName.length) === axisName) {
const num = parseInt(axis.name.substr(axisName.length));
if (num >= value) value = num + 1;
}
return value;
}, 1);
$scope.vis.params.valueAxes.push(newAxis);
};
@ -84,6 +105,17 @@ module.directive('vislibValueAxes', function ($parse, $compile) {
}
};
$scope.updateAxisName = function (axis) {
const axisName = _.capitalize(axis.position) + 'Axis-';
axis.name = axisName + $scope.vis.params.valueAxes.reduce((value, axis) => {
if (axis.name.substr(0, axisName.length) === axisName) {
const num = parseInt(axis.name.substr(axisName.length));
if (num >= value) value = num + 1;
}
return value;
}, 1);
};
const lastAxisTitles = {};
$scope.$watch(() => {
return $scope.vis.aggs.map(agg => {

6
src/core_plugins/kbn_vislib_vis_types/public/histogram.js
View file

@ -33,6 +33,7 @@ export default function PointSeriesVisType(Private) {
},
labels: {
show: true,
truncate: 100
},
title: {}
}
@ -40,6 +41,7 @@ export default function PointSeriesVisType(Private) {
valueAxes: [
{
id: 'ValueAxis-1',
name: 'LeftAxis-1',
type: 'value',
position: 'left',
show: true,
@ -65,7 +67,9 @@ export default function PointSeriesVisType(Private) {
mode: 'stacked',
data: {
label: 'Count'
}
},
drawLinesBetweenPoints: true,
showCircles: true
}
],
addTooltip: true,

2
src/core_plugins/kbn_vislib_vis_types/public/line.js
View file

@ -33,6 +33,7 @@ export default function PointSeriesVisType(Private) {
},
labels: {
show: true,
truncate: 100
},
title: {}
}
@ -40,6 +41,7 @@ export default function PointSeriesVisType(Private) {
valueAxes: [
{
id: 'ValueAxis-1',
name: 'LeftAxis-1',
type: 'value',
position: 'left',
show: true,