IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

fixed persistance of alias color changes

Browse Source
This commit is contained in:
Torkel Ödegaard 2013-12-28 17:51:20 +01:00
parent 210d4d13eb
commit 433af08371
5 changed files with 46 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/app/panels/graphite/funcEditor.html
View File

@ -10,7 +10,6 @@
</a>
&nbsp;&nbsp;
<a class="close" ng-click="dismiss();" href="">×</a>
</div>
<div class="editor-row" ng-if="func.def.params.length">

32
src/app/panels/graphite/legend.html Normal file
View File

@ -0,0 +1,32 @@
<span ng-show="panel.legend"
ng-class="{'pull-right': series.yaxis === 2, 'hidden-series': hiddenSeries[series.alias]}"
ng-repeat='series in legend'
class="histogram-legend">
<i class='icon-circle pointer'
ng-style="{color: series.color}"
bs-popover="'colorPopup.html'"
data-unique="1"
data-placement="bottomLeft">
</i>
<span class='small histogram-legend-item'>
<a ng-click="toggleSeries(series)">
{{series.alias}}
</a>
</span>
</span>
<script type="text/ng-template" id="colorPopup.html">
<div style="width: 150px;">
<div>
<a class="close pull-right" ng-click="dismiss();" href="">×</a>
<div class="clearfix"></div>
</div>
<i ng-repeat="color in colors"
class="pointer"
ng-class="{'icon-circle-blank': color === series.color,'icon-circle': color !== series.color}"
ng-style="{color:color}"
ng-click="changeSeriesColor(series, color);dismiss();">
</i>
</div>
</script>

19
src/app/panels/graphite/module.html
View File

@ -50,23 +50,8 @@
<div histogram-chart class="pointer histogram-chart" params="{{panel}}">
</div>
<div class="grafana-legend-container">
<span ng-show="panel.legend"
ng-class="{'pull-right': series.yaxis === 2, 'hidden-series': hiddenSeries[series.alias]}"
ng-repeat='series in legend'
class="histogram-legend">
<i class='icon-circle pointer'
ng-style="{color: series.color}"
bs-popover="'app/panels/graphite/seriesColor.html'"
data-unique="1"
data-placement="bottomLeft">
</i>
<span class='small histogram-legend-item'>
<a ng-click="toggleSeries(series)">
{{series.alias}}
</a>
</span>
</span>
<div ng-if="panel.legend" class="grafana-legend-container">
<div ng-include="'app/panels/graphite/legend.html'"></div>
</div>
<div class="panel-full-edit-tabs" ng-if="inEditMode">

21
src/app/panels/graphite/module.js
View File

@ -193,14 +193,15 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
* zerofill:: Improves the accuracy of line charts at a small performance cost.
*/
zerofill : true,
/** @scratch /panels/histogram/3
* derivative:: Show each point on the x-axis as the change from the previous point
*/
tooltip : {
value_type: 'cumulative',
query_as_alias: true
},
targets: []
targets: [],
aliasColors: {}
};
_.defaults($scope.panel,_d);
@ -217,7 +218,6 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
$scope.editor = {index: 1};
$scope.editorTabs = _.union(['General'],_.pluck($scope.panelMeta.fullEditorTabs,'title'));
$scope.hiddenSeries = {};
$scope.aliasToColor = {};
// Always show the query if an alias isn't set. Users can set an alias if the query is too
// long
$scope.panel.tooltip.query_as_alias = true;
@ -335,9 +335,6 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
throw { message: 'no data in response from graphite' };
}
//console.log('Data from graphite:', results);
//console.log('nr datapoints from graphite: %d', results[0].datapoints.length);
var tsOpts = {
interval: interval,
start_date: range && range.from,
@ -356,7 +353,7 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
var target = graphiteSrv.match($scope.panel.targets, targetData.target);
var alias = targetData.target;
var color = $scope.aliasToColor[alias] || $scope.colors[data.length];
var color = $scope.panel.aliasColors[alias] || $scope.colors[data.length];
var seriesInfo = {
alias: alias,
@ -438,6 +435,12 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
$scope.$emit('render');
};
$scope.changeSeriesColor = function(series, color) {
series.color = color;
$scope.panel.aliasColors[series.alias] = series.color;
$scope.render();
}
$scope.toggleFullscreen = function(evt) {
if ($scope.showFullscreen) {
$rootScope.$emit('panel-fullscreen-exit');

8
src/app/panels/graphite/seriesColor.html
View File

@ -1,8 +0,0 @@
<div style="width: 150px;">
<i ng-repeat="color in colors"
class="pointer"
ng-class="{'icon-circle-blank': color === series.color,'icon-circle': color !== series.color}"
ng-style="{color:color}"
ng-click="series.color = color;render();aliasToColor[series.alias] = color;">
</i>
</div>