mirror of
https://github.com/elastic/kibana.git
synced 2025-04-23 17:28:26 -04:00
fixing based on review
This commit is contained in:
parent
7d8718beab
commit
d55b440174
8 changed files with 42 additions and 5667 deletions
|
@ -31,7 +31,7 @@
|
|||
<select
|
||||
id="axisScale"
|
||||
class="kuiSelect kuiSideBarSelect"
|
||||
ng-model="vis.params.valueAxes[0].scale.type"
|
||||
ng-model="valueAxis.scale.type"
|
||||
ng-options="mode for mode in vis.type.params.scales"
|
||||
></select>
|
||||
</div>
|
||||
|
@ -42,11 +42,11 @@
|
|||
Scale to Data Bounds
|
||||
</label>
|
||||
<div class="kuiSideBarFormRow__control">
|
||||
<input class="kuiCheckBox" id="defaultYExtents" type="checkbox" ng-model="vis.params.valueAxes[0].scale.defaultYExtents">
|
||||
<input class="kuiCheckBox" id="defaultYExtents" type="checkbox" ng-model="valueAxis.scale.defaultYExtents">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="kuiSideBarFormRow">
|
||||
<div class="kuiSideBarFormRow" ng-if="!vis.params.setColorRange">
|
||||
<label class="kuiSideBarFormRow__label" for="percentageMode">
|
||||
Percentage Mode
|
||||
</label>
|
||||
|
@ -159,13 +159,13 @@
|
|||
<div class="kuiSideBarCollapsibleTitle">
|
||||
<div
|
||||
class="kuiSideBarCollapsibleTitle__label"
|
||||
ng-click="vis.params.valueAxes[0].labels.show = !vis.params.valueAxes[0].labels.show"
|
||||
ng-click="valueAxis.labels.show = !valueAxis.labels.show"
|
||||
>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
ng-class="{
|
||||
'fa-caret-down': vis.params.valueAxes[0].labels.show,
|
||||
'fa-caret-right': !vis.params.valueAxes[0].labels.show
|
||||
'fa-caret-down': valueAxis.labels.show,
|
||||
'fa-caret-right': !valueAxis.labels.show
|
||||
}"
|
||||
class="fa fa-caret-right kuiSideBarCollapsibleTitle__caret"
|
||||
></span>
|
||||
|
@ -174,19 +174,32 @@
|
|||
</span>
|
||||
</div>
|
||||
<input aria-label="enable"
|
||||
ng-model="vis.params.valueAxes[0].labels.show"
|
||||
ng-model="valueAxis.labels.show"
|
||||
type="checkbox"
|
||||
class="kuiSideBarSectionTitle__action"
|
||||
>
|
||||
</div>
|
||||
<div ng-if="vis.params.valueAxes[0].labels.show" class="kuiSideBarCollapsibleSection">
|
||||
<div ng-if="valueAxis.labels.show" class="kuiSideBarCollapsibleSection">
|
||||
<div class="kuiSideBarSection">
|
||||
<div class="kuiSideBarFormRow">
|
||||
<label class="kuiSideBarFormRow__label" for="rotateLabels">
|
||||
Rotate
|
||||
</label>
|
||||
<div class="kuiSideBarFormRow__control">
|
||||
<input class="kuiCheckBox" id="rotateLabels" type="checkbox" ng-model="options.labels">
|
||||
<input class="kuiCheckBox" id="rotateLabels" type="checkbox" ng-model="options.rotateLabels">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="kuiSideBarFormRow">
|
||||
<label class="kuiSideBarFormRow__label" for="labelColor">
|
||||
Color
|
||||
</label>
|
||||
<div class="kuiSideBarFormRow__control">
|
||||
<input
|
||||
id="labelColor"
|
||||
class="kuiInput kuiSideBarInput"
|
||||
ng-model="valueAxis.labels.color"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -3,7 +3,7 @@ import heatmapOptionsTemplate from 'plugins/kbn_vislib_vis_types/controls/heatma
|
|||
import _ from 'lodash';
|
||||
const module = uiModules.get('kibana');
|
||||
|
||||
module.directive('heatmapOptions', function ($parse, $compile, getAppState) {
|
||||
module.directive('heatmapOptions', function () {
|
||||
return {
|
||||
restrict: 'E',
|
||||
template: heatmapOptionsTemplate,
|
||||
|
@ -12,10 +12,12 @@ module.directive('heatmapOptions', function ($parse, $compile, getAppState) {
|
|||
$scope.isColorRangeOpen = true;
|
||||
$scope.customColors = false;
|
||||
$scope.options = {
|
||||
labels: false
|
||||
rotateLabels: false
|
||||
};
|
||||
|
||||
$scope.$watch('options.labels', rotate => {
|
||||
$scope.valueAxis = $scope.vis.params.valueAxes[0];
|
||||
|
||||
$scope.$watch('options.rotateLabels', rotate => {
|
||||
$scope.vis.params.valueAxes[0].labels.rotate = rotate ? 270 : 0;
|
||||
});
|
||||
|
||||
|
@ -33,12 +35,10 @@ module.directive('heatmapOptions', function ($parse, $compile, getAppState) {
|
|||
const previousRange = _.last($scope.vis.params.colorsRange);
|
||||
const from = previousRange ? previousRange.to : 0;
|
||||
$scope.vis.params.colorsRange.push({from: from, to: null});
|
||||
$scope.vis.params.colorsNumber = $scope.vis.params.colorsRange.length;
|
||||
};
|
||||
|
||||
$scope.removeRange = function (index) {
|
||||
$scope.vis.params.colorsRange.splice(index, 1);
|
||||
$scope.vis.params.colorsNumber = $scope.vis.params.colorsRange.length;
|
||||
};
|
||||
|
||||
$scope.getColor = function (index) {
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<div class="kuiSideBarSection">
|
||||
<div class="kuiSideBarSectionTitle">
|
||||
<div class="kuiSideBarSectionTitle__text">
|
||||
Global Settings
|
||||
Basic Settings
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
import VislibVisTypeVislibVisTypeProvider from 'ui/vislib_vis_type/vislib_vis_type';
|
||||
import VisSchemasProvider from 'ui/vis/schemas';
|
||||
import heatmapTemplate from 'plugins/kbn_vislib_vis_types/editors/heatmap.html';
|
||||
import heatmapColors from 'ui/vislib/components/color/colormaps';
|
||||
|
||||
export default function HeatmapVisType(Private) {
|
||||
const VislibVisType = Private(VislibVisTypeVislibVisTypeProvider);
|
||||
|
@ -25,7 +26,6 @@ export default function HeatmapVisType(Private) {
|
|||
colorsRange: [],
|
||||
invertColors: false,
|
||||
percentageMode: false,
|
||||
cellLabels: false,
|
||||
valueAxes: [{
|
||||
show: false,
|
||||
id: 'ValueAxis-1',
|
||||
|
@ -54,8 +54,7 @@ export default function HeatmapVisType(Private) {
|
|||
text: 'bottom',
|
||||
}],
|
||||
scales: ['linear', 'log', 'square root'],
|
||||
colorSchemas: ['Blues', 'Greens', 'Greys', 'Reds', 'YlOrRd', 'autumn', 'bone',
|
||||
'hot', 'coolwarm', 'Spectral', 'gist_earth', 'terrain', 'gnuplot', 'jet'],
|
||||
colorSchemas: Object.keys(heatmapColors),
|
||||
editor: heatmapTemplate
|
||||
},
|
||||
schemas: new Schemas([
|
||||
|
|
|
@ -15,7 +15,6 @@ uiModules
|
|||
controllerAs: 'sidebar',
|
||||
controller: function ($scope) {
|
||||
$scope.$bind('vis', 'editableVis');
|
||||
$scope.$bind('uiState', 'uiState');
|
||||
|
||||
$scope.$watch('vis.type', (visType) => {
|
||||
if (visType) {
|
||||
|
|
File diff suppressed because it is too large
Load diff
|
@ -150,7 +150,7 @@ export default function HeatmapChartFactory(Private) {
|
|||
val = colorsNumber - 1;
|
||||
} else {
|
||||
val = (d.y - min) / (max - min); /* get val from 0 - 1 */
|
||||
val = Math.floor(val * (colorsNumber - 1));
|
||||
val = Math.round(val * (colorsNumber - 1));
|
||||
}
|
||||
}
|
||||
return val;
|
||||
|
@ -182,7 +182,7 @@ export default function HeatmapChartFactory(Private) {
|
|||
.attr('height', squareHeight)
|
||||
.attr('data-label', label)
|
||||
.attr('fill', z)
|
||||
.attr('style', 'opacity: 1; cursor: pointer; stroke: black; stroke-width: 0.3px')
|
||||
.attr('style', 'cursor: pointer; stroke: black; stroke-width: 0.1px')
|
||||
.style('display', d => {
|
||||
return d.hide ? 'none' : 'initial';
|
||||
});
|
||||
|
@ -215,6 +215,7 @@ export default function HeatmapChartFactory(Private) {
|
|||
})
|
||||
.style('dominant-baseline', 'central')
|
||||
.style('text-anchor', 'middle')
|
||||
.style('stroke', zAxisConfig.get('labels.color'))
|
||||
.attr('x', function (d) {
|
||||
const center = x(d) + squareWidth / 2;
|
||||
return center;
|
||||
|
|
|
@ -24,8 +24,6 @@ uiModules.get('kibana')
|
|||
refresh();
|
||||
});
|
||||
|
||||
$scope.uiState.on('change', refresh);
|
||||
|
||||
$scope.$watch('renderbot.vislibParams', () => {
|
||||
refresh();
|
||||
});
|
||||
|
@ -58,6 +56,7 @@ uiModules.get('kibana')
|
|||
$scope.uiState.setSilent('vis.colors', null);
|
||||
$scope.uiState.set('vis.colors', colors);
|
||||
$scope.uiState.emit('colorChanged');
|
||||
refresh();
|
||||
};
|
||||
|
||||
$scope.toggleLegend = function () {
|
||||
|
@ -106,6 +105,10 @@ uiModules.get('kibana')
|
|||
function refresh() {
|
||||
if (!$scope.renderbot) return;
|
||||
const vislibVis = $scope.renderbot.vislibVis;
|
||||
if (!vislibVis.visConfig) {
|
||||
$scope.labels = [{ label: 'loading ...' }];
|
||||
return $timeout(refresh, 100);
|
||||
} // make sure vislib is defined at this point
|
||||
|
||||
if ($scope.uiState.get('vis.legendOpen') == null && $scope.vis.params.addLegend != null) {
|
||||
$scope.open = $scope.vis.params.addLegend;
|
||||
|
@ -114,10 +117,9 @@ uiModules.get('kibana')
|
|||
if (vislibVis.visConfigArgs.type === 'heatmap') {
|
||||
const labels = vislibVis.getLegendLabels();
|
||||
if (labels) {
|
||||
$scope.labels = _.map(labels, label => { return { label: label }; });
|
||||
} else {
|
||||
$scope.labels = [{ label: 'loading ...' }];
|
||||
$timeout(refresh, 100);
|
||||
$scope.labels = _.map(labels, label => {
|
||||
return {label: label};
|
||||
});
|
||||
}
|
||||
} else {
|
||||
$scope.labels = getLabels($scope.data, vislibVis.visConfigArgs.type);
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue