mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
feat(influxdb): began work on some influxdb enhancements, #2311
This commit is contained in:
parent
63f8800007
commit
597c1f6a41
@ -48,7 +48,6 @@ in the main Time Picker in the upper right, but they can also have relative time
|
|||||||
2. To edit the graph you click on the graph title to open the panel menu, then `Edit`.
|
2. To edit the graph you click on the graph title to open the panel menu, then `Edit`.
|
||||||
3. This should take you to the `Metrics` tab. In this tab you should see the editor for your default data source.
|
3. This should take you to the `Metrics` tab. In this tab you should see the editor for your default data source.
|
||||||
|
|
||||||
|
|
||||||
## Drag-and-Drop panels
|
## Drag-and-Drop panels
|
||||||
|
|
||||||
You can Drag-and-Drop Panels within and between Rows. Click and hold the Panel title, and drag it to its new location.
|
You can Drag-and-Drop Panels within and between Rows. Click and hold the Panel title, and drag it to its new location.
|
||||||
|
@ -11,30 +11,26 @@ function (angular, _, $) {
|
|||||||
.directive('influxdbFuncEditor', function($compile) {
|
.directive('influxdbFuncEditor', function($compile) {
|
||||||
|
|
||||||
var funcSpanTemplate = '<a gf-dropdown="functionMenu" class="dropdown-toggle" ' +
|
var funcSpanTemplate = '<a gf-dropdown="functionMenu" class="dropdown-toggle" ' +
|
||||||
'data-toggle="dropdown">{{target.function}}</a><span>(</span>';
|
'data-toggle="dropdown">{{field.func}}</a><span>(</span>';
|
||||||
|
|
||||||
var paramTemplate = '<input type="text" style="display:none"' +
|
var paramTemplate = '<input type="text" style="display:none"' +
|
||||||
' class="input-mini tight-form-func-param"></input>';
|
' class="input-mini tight-form-func-param"></input>';
|
||||||
|
|
||||||
return {
|
return {
|
||||||
restrict: 'A',
|
restrict: 'A',
|
||||||
|
scope: {
|
||||||
|
field: "=",
|
||||||
|
},
|
||||||
link: function postLink($scope, elem) {
|
link: function postLink($scope, elem) {
|
||||||
var $funcLink = $(funcSpanTemplate);
|
var $funcLink = $(funcSpanTemplate);
|
||||||
|
|
||||||
$scope.functionMenu = _.map($scope.functions, function(func) {
|
|
||||||
return {
|
|
||||||
text: func,
|
|
||||||
click: "changeFunction('" + func + "');"
|
|
||||||
};
|
|
||||||
});
|
|
||||||
|
|
||||||
function clickFuncParam() {
|
function clickFuncParam() {
|
||||||
/*jshint validthis:true */
|
/*jshint validthis:true */
|
||||||
|
|
||||||
var $link = $(this);
|
var $link = $(this);
|
||||||
var $input = $link.next();
|
var $input = $link.next();
|
||||||
|
|
||||||
$input.val($scope.target.column);
|
$input.val($scope.field.name);
|
||||||
$input.css('width', ($link.width() + 16) + 'px');
|
$input.css('width', ($link.width() + 16) + 'px');
|
||||||
|
|
||||||
$link.hide();
|
$link.hide();
|
||||||
@ -58,7 +54,7 @@ function (angular, _, $) {
|
|||||||
if ($input.val() !== '') {
|
if ($input.val() !== '') {
|
||||||
$link.text($input.val());
|
$link.text($input.val());
|
||||||
|
|
||||||
$scope.target.column = $input.val();
|
$scope.field.name = $input.val();
|
||||||
$scope.$apply($scope.get_data);
|
$scope.$apply($scope.get_data);
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -84,7 +80,7 @@ function (angular, _, $) {
|
|||||||
|
|
||||||
$input.typeahead({
|
$input.typeahead({
|
||||||
source: function () {
|
source: function () {
|
||||||
return $scope.listColumns.apply(null, arguments);
|
return $scope.getFields.apply(null, arguments);
|
||||||
},
|
},
|
||||||
minLength: 0,
|
minLength: 0,
|
||||||
items: 20,
|
items: 20,
|
||||||
|
@ -65,10 +65,9 @@
|
|||||||
<li class="tight-form-item query-keyword" style="width: 75px;">
|
<li class="tight-form-item query-keyword" style="width: 75px;">
|
||||||
SELECT
|
SELECT
|
||||||
</li>
|
</li>
|
||||||
<li class="dropdown tight-form-item">
|
<li class="dropdown" ng-repeat="field in target.fields">
|
||||||
<a gf-dropdown="functionMenu" class="dropdown-toggle" data-toggle="dropdown">
|
<span influxdb-func-editor field="field" class="tight-form-item tight-form-func">
|
||||||
{{target.function}}<span>(value)</span>
|
</span>
|
||||||
</a>
|
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
@ -114,8 +113,8 @@
|
|||||||
<i class="fa fa-eye invisible"></i>
|
<i class="fa fa-eye invisible"></i>
|
||||||
</li>
|
</li>
|
||||||
|
|
||||||
<li class="tight-form-item" >
|
<li class="tight-form-item query-keyword">
|
||||||
<span class="query-keyword">GROUP BY</span>
|
GROUP BY
|
||||||
</li>
|
</li>
|
||||||
|
|
||||||
<li class="tight-form-item">
|
<li class="tight-form-item">
|
||||||
|
@ -38,6 +38,9 @@ function (_) {
|
|||||||
measurement = this.target.measurement;
|
measurement = this.target.measurement;
|
||||||
} else if (type === 'MEASUREMENTS') {
|
} else if (type === 'MEASUREMENTS') {
|
||||||
query = 'SHOW MEASUREMENTS';
|
query = 'SHOW MEASUREMENTS';
|
||||||
|
} else if (type === 'FIELDS') {
|
||||||
|
query = 'SHOW FIELD KEYS FROM "' + this.target.measurement + '"';
|
||||||
|
return query;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (measurement) {
|
if (measurement) {
|
||||||
|
@ -21,9 +21,12 @@ function (angular, _, InfluxQueryBuilder) {
|
|||||||
|
|
||||||
$scope.init = function() {
|
$scope.init = function() {
|
||||||
var target = $scope.target;
|
var target = $scope.target;
|
||||||
target.function = target.function || 'mean';
|
|
||||||
target.tags = target.tags || [];
|
target.tags = target.tags || [];
|
||||||
target.groupByTags = target.groupByTags || [];
|
target.groupByTags = target.groupByTags || [];
|
||||||
|
target.fields = target.fields || [{
|
||||||
|
name: 'value',
|
||||||
|
func: target.function || 'mean'
|
||||||
|
}];
|
||||||
|
|
||||||
$scope.queryBuilder = new InfluxQueryBuilder(target);
|
$scope.queryBuilder = new InfluxQueryBuilder(target);
|
||||||
|
|
||||||
@ -94,6 +97,15 @@ function (angular, _, InfluxQueryBuilder) {
|
|||||||
$scope.$parent.get_data();
|
$scope.$parent.get_data();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
$scope.getFields = function(query, callback) {
|
||||||
|
var fieldsQuery = $scope.queryBuilder.buildExploreQuery('FIELDS');
|
||||||
|
return $scope.datasource.metricFindQuery(fieldsQuery)
|
||||||
|
.then(function(results) {
|
||||||
|
var fields = _.pluck(results, 'text');
|
||||||
|
callback(fields);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
$scope.toggleQueryMode = function () {
|
$scope.toggleQueryMode = function () {
|
||||||
$scope.target.rawQuery = !$scope.target.rawQuery;
|
$scope.target.rawQuery = !$scope.target.rawQuery;
|
||||||
};
|
};
|
||||||
|
@ -130,6 +130,12 @@ define([
|
|||||||
expect(query).to.be('SHOW TAG VALUES FROM "cpu" WITH KEY = "app" WHERE "host" =~ /server.*/');
|
expect(query).to.be('SHOW TAG VALUES FROM "cpu" WITH KEY = "app" WHERE "host" =~ /server.*/');
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it('should build show field query', function() {
|
||||||
|
var builder = new InfluxQueryBuilder({measurement: 'cpu', tags: [{key: 'app', value: 'email'}]});
|
||||||
|
var query = builder.buildExploreQuery('FIELDS');
|
||||||
|
expect(query).to.be('SHOW FIELD KEYS FROM "cpu"');
|
||||||
|
});
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
});
|
});
|
||||||
|
Loading…
Reference in New Issue
Block a user