Skip to content

N
nexpie-grafana-theme
Commit b0d016f5 by Torkel Ödegaard
Options

Merge branch 'master' of github.com:torkelo/grafana

parents cd5b17b0 c3ceb909
Showing with 102 additions and 155 deletions
README.md
# Grafana
# Grafana - Graphite Dashboard
Experimenting with a a custom graph dashboard based on [kibana](https://github.com/elasticsearch/kibana).
A beautifully, easy to use and feature rich Graphite dashboard replacement and graph editor. Visit [grafana.org](http://grafana.org) for screenshots and an overview.
# Features
## Graphite Target Editor
- Graphite target expression parser
- Quickly add / edit / remove function
- Function parameters can be easily changed
- Quickly navigate graphite metric structure
- Templating
- Integrated function documentation (TODO)
- Click & drag functions to rearrange order (TODO)
- Much more...
## Graphing
- Fast rendering, even over large timespans.
- Click and drag to zoom.
- Multiple Y-axis.
- Bars, Lines, Points.
- Smart Y-axis formating
- Series toggles & color selector
- Axis labels
- Fullscreen views and more...
## Dashboards
- Create and edit dashboards
- Drag and drop graphs to rearrange
- Set column spans and row heights
- Save & search dashboards (ElasticSearch)
- Import & export dashboard (json file)
- Import dashboard from Graphite
- Templating
- Much more...
# Requirements
Grafana is very easy to install. It is a client side web app with no backend. Any webserver will do. Optionally you will need ElasticSearch if you want to be able to save and load dashboards quickly instead of json files or local storage.
# Installation
- Download and extract the [latest release](https://github.com/asimov-deploy/asimov-deploy-winagent/releases/latest).
- Edit config.js , the change graphiteUrl and elasticsearch to the correct urls. The urls entered here must be reachable by your browser.
- Point your browser to the installation.
# Graphite server config
If you haven't used an alternative dashboard for graphite before you need to enable cross-domain origin request. For Apache 2.x:
```
Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-Methods "GET, OPTIONS"
Header set Access-Control-Allow-Headers "origin, authorization, accept"
```
If your Graphite web is proteced by basic authentication, you have to enable the HTTP verb OPTIONS. This looks like the following for Apache:
```
<Location />
AuthName "graphs restricted"
AuthType Basic
AuthUserFile /etc/apache2/htpasswd
<LimitExcept OPTIONS>
require valid-user
</LimitExcept>
</Location>
```
# Roadmap
- Improve and refine the target parser and editing
- Improve graphite import feature
- Refine and simplify common tasks
- More panel types (not just graphs)
- Use elasticsearch to search for metrics
- Improve template support
- Add support for other time series databases like InfluxDB
# Contribute
If you have any idea for improvement or found a bug do not hesitate to open an issue. And if you have time clone this repo and submit a pull request and help me make Grafana the kickass metrics & devops dashboard we all dream about!
# Notice
This software is based on the great log dashboard [kibana](https://github.com/elasticsearch/kibana).
# License
Grafana is distributed under Apache 2.0 License.
\ No newline at end of file
index.html deleted 100644 → 0
<!DOCTYPE html>
<head>
<title>Kibana 3</title>
<style>/* add your css style rules here */
body {
color:#c8c8c8;
background-color:#272b30;
font-family: 'Open Sans', sans-serif;
}
a {
color: #63ABB5;
}
.title1 {
font-weight: 800;
line-height: .9;
font-size: 98px
}
.title2 {
font-weight: 800;
line-height: .9;
font-size: 60px
}
.title3 {
font-weight: 800;
font-size: 25px;
line-height: 1.1;
}
.lowercase {
text-transform: lowercase;
}
.uppercase {
text-transform: uppercase;
}
.light {
font-weight: 200;
}
.big { text-transform: uppercase; margin: 0; padding: 0; }
.bold { font-weight: 800; }
.orange {
color: #FF9640;
}
.yellow {
color: #FFDD68;
}
.teal {
color: #63ABB5;
}
.green {
color: #629153;
}
.purple {
color: #645068;
}
.white {
color: #fff;
}
</style>
</head>
<body ng-controller="DashCtrl" ng-cloak>
<img src='src/img/kibana.png' style="float:right;margin:30px 60px 30px 60px;"><p>
<div class="title2">
<span class="orange">Oops.</span> Looks like you've upgraded from an old version
</div>
<div class="title3">No worries. <span class="light">Kibana has a new build system. Now its faster and lighter than ever before.</span></div>
<p>
<div class="white title3 uppercase">To fix this</div>
<div class="title3 light">Instead of cloning the entire kibana, you can grab the latest build here: <a href="http://download.elasticsearch.org/kibana/kibana/kibana-latest.zip">http://download.elasticsearch.org/kibana/kibana/kibana-latest.zip</a><p>
If you really want to run from source you can do so from the <a href="src/index.html">src/</a> folder. After upgrading you may need to clear your browsers cache to see all of the new features.</div>
</body>
</html>
package.json
{
"author": {
"name": "Rashid Khan",
"company": "Elasticsearch BV"
"name": "Torkel Ödegaard",
"company": "Coding Instinct AB"
},
"name": "kibana",
"version": "3.0.0pre-milestone5",
"name": "grafana",
"version": "1.0.0",
"repository": {
"type": "git",
"url": "http://github.com/elasticsearch/kibana.git"
"url": "http://github.com/torkelo/grafana.git"
},
"devDependencies": {
"rjs-build-analysis": "0.0.3",
......
src/app/components/settings.js
......@@ -11,11 +11,10 @@ function (_) {
*/
var defaults = {
elasticsearch : "http://"+window.location.hostname+":9200",
graphiteUrl : "http://"+window.location.hostname+":8080",
panel_names : [],
kibana_index : 'kibana-int',
graphiteUrl : null,
default_route : '/dashboard/file/default.json',
grafana_index : 'grafana-int2'
grafana_index : 'grafana-dash'
};
// This initializes a new hash on purpose, to avoid adding parameters to
......
src/app/controllers/metricKeys.js
......@@ -9,7 +9,7 @@ function (angular, _, config) {
var module = angular.module('kibana.controllers');
module.controller('MetricKeysCtrl', function($scope, $http, $q) {
var elasticSearchUrlForMetricIndex = config.elasticsearch + '/' + config.grafana_index + '/';
var elasticSearchUrlForMetricIndex = config.elasticsearch + '/' + config.grafana_metrics_index + '/';
$scope.init = function () {
$scope.metricPath = "prod.apps.api.boobarella.*";
......@@ -149,7 +149,7 @@ function (angular, _, config) {
function saveMetricKey(metricId) {
// Create request with id as title. Rethink this.
var request = $scope.ejs.Document(config.grafana_index, 'metricKey', metricId).source({
var request = $scope.ejs.Document(config.grafana_metrics_index, 'metricKey', metricId).source({
metricPath: metricId
});
......
src/app/services/dashboard.js
......@@ -287,7 +287,7 @@ function (angular, $, kbn, _, config, moment, Modernizr) {
this.elasticsearch_load = function(type,id) {
return $http({
url: config.elasticsearch + "/" + config.kibana_index + "/"+type+"/"+id+'?' + new Date().getTime(),
url: config.elasticsearch + "/" + config.grafana_index + "/"+type+"/"+id+'?' + new Date().getTime(),
method: "GET",
transformResponse: function(response) {
return renderTemplate(angular.fromJson(response)._source.dashboard, $routeParams);
......@@ -340,7 +340,7 @@ function (angular, $, kbn, _, config, moment, Modernizr) {
}
// Create request with id as title. Rethink this.
var request = ejs.Document(config.kibana_index,type,id).source({
var request = ejs.Document(config.grafana_index,type,id).source({
user: 'guest',
group: 'guest',
title: save.title,
......@@ -365,7 +365,7 @@ function (angular, $, kbn, _, config, moment, Modernizr) {
};
this.elasticsearch_delete = function(id) {
return ejs.Document(config.kibana_index,'dashboard',id).doDelete(
return ejs.Document(config.grafana_index,'dashboard',id).doDelete(
// Success
function(result) {
return result;
......@@ -378,7 +378,7 @@ function (angular, $, kbn, _, config, moment, Modernizr) {
};
this.elasticsearch_list = function(query,count) {
var request = ejs.Request().indices(config.kibana_index).types('dashboard');
var request = ejs.Request().indices(config.grafana_index).types('dashboard');
return request.query(
ejs.QueryStringQuery(query || '*')
).size(count).doSearch(
......
src/config.js
......@@ -7,50 +7,16 @@ define(['settings'],
function (Settings) {
"use strict";
/** @scratch /configuration/config.js/2
* === Parameters
*/
return new Settings({
/** @scratch /configuration/config.js/5
* ==== elasticsearch
*
* The URL to your elasticsearch server. You almost certainly don't
* want +http://localhost:9200+ here. Even if Grafana and Elasticsearch are on
* the same host. By default this will attempt to reach ES at the same host you have
* Grafana installed on. You probably want to set it to the FQDN of your
* elasticsearch host
*/
elasticsearch: "http://"+window.location.hostname+":9200",
graphiteUrl: "http://"+window.location.hostname+":8080",
/** @scratch /configuration/config.js/5
* ==== default_route
*
* This is the default landing page when you don't specify a dashboard to load. You can specify
* files, scripts or saved dashboards here. For example, if you had saved a dashboard called
* `WebLogs' to elasticsearch you might use:
*
* +default_route: '/dashboard/elasticsearch/WebLogs',+
*/
default_route : '/dashboard/file/default.json',
default_route: '/dashboard/file/default.json',
/** @scratch /configuration/config.js/5
* ==== Grafana-int
*
* The default ES index to use for storing Grafana specific object
* such as stored dashboards
*/
kibana_index: "kibana-int",
grafana_index: "grafana-int",
grafana_index: "grafana-dash",
/** @scratch /configuration/config.js/5
* ==== panel_name
*
* An array of panel modules available. Panels will only be loaded when they are defined in the
* dashboard, but this list is used in the "add panel" interface.
*/
panel_names: [
'text',
'graphite'
......
src/index.html
......@@ -34,7 +34,7 @@
<div class="navbar navbar-static-top">
<div class="navbar-inner">
<div class="container-fluid">
<span class="brand"><img src="img/small.png" bs-tooltip="'Kibana 3 milestone pre-5'" data-placement="bottom"> {{dashboard.current.title}}</span>
<span class="brand"><img src="img/small.png" bs-tooltip="'Grafana'" data-placement="bottom"> {{dashboard.current.title}}</span>
<ul class="nav pull-right" ng-controller='dashLoader' ng-init="init()" ng-include="'app/partials/dashLoader.html'">
</ul>
</div>
......
tasks/distribute_task.js
......@@ -12,12 +12,12 @@ module.exports = function(grunt) {
// build, then zip and upload to s3
grunt.registerTask('release', [
'distribute:load_s3_config',
// 'distribute:load_s3_config',
'build',
'compress:zip_release',
'compress:tgz_release',
's3:release',
'clean:temp'
//'s3:release',
//'clean:temp'
]);
// collect the key and secret from the .aws-config.json file, finish configuring the s3 task
......
tasks/options/compress.js
......@@ -9,12 +9,10 @@ module.exports = function(config) {
expand: true,
cwd: '<%= destDir %>',
src: ['**/*'],
dest: '<%= pkg.name %>-latest'
},
{
expand: true,
src: ['LICENSE.md', 'README.md'],
dest: '<%= pkg.name %>-latest'
src: ['LICENSE.md', 'README.md', 'NOTICE.md'],
}
]
},
......@@ -27,12 +25,10 @@ module.exports = function(config) {
expand: true,
cwd: '<%= destDir %>',
src: ['**/*'],
dest: '<%= pkg.name %>-latest'
},
{
expand: true,
src: ['LICENSE.md', 'README.md'],
dest: '<%= pkg.name %>-latest'
src: ['LICENSE.md', 'README.md', 'NOTICE.md'],
}
]
},
......@@ -45,12 +41,10 @@ module.exports = function(config) {
expand: true,
cwd: '<%= destDir %>',
src: ['**/*'],
dest: '<%= pkg.name %>-<%= pkg.version %>'
},
{
expand: true,
src: ['LICENSE.md', 'README.md'],
dest: '<%= pkg.name %>-<%= pkg.version %>'
src: ['LICENSE.md', 'README.md', 'NOTICE.md'],
}
]
},
......@@ -63,12 +57,10 @@ module.exports = function(config) {
expand: true,
cwd: '<%= destDir %>',
src: ['**/*'],
dest: '<%= pkg.name %>-<%= pkg.version %>'
},
{
expand: true,
src: ['LICENSE.md', 'README.md'],
dest: '<%= pkg.name %>-<%= pkg.version %>'
src: ['LICENSE.md', 'README.md', 'NOTICE.md'],
}
]
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment