Skip to content

N
nexpie-grafana-theme
Commit ea62d4ae by Rashid Khan
Options

Added pointer to chart hovers

parent 7ab2a534
Showing with 16 additions and 16 deletions
panels/histogram/module.html
...@@ -8,10 +8,10 @@ ...@@ -8,10 +8,10 @@
display:inline-block; display:inline-block;
height:10px; height:10px;
width:10px; width:10px;
border-radius:5px; border-radius:5px;
} }
.histogram-legend-item { .histogram-legend-item {
display:inline-block; display:inline-block;
} }
.histogram-chart { .histogram-chart {
position:relative; position:relative;
...@@ -23,7 +23,7 @@ ...@@ -23,7 +23,7 @@
<div> <div>
<span ng-show='panel.zoomlinks && data'> <span ng-show='panel.zoomlinks && data'>
<!--<a class='small' ng-click='zoom(0.5)'><i class='icon-zoom-in'></i> Zoom In</a>--> <!--<a class='small' ng-click='zoom(0.5)'><i class='icon-zoom-in'></i> Zoom In</a>-->
<a class='small' ng-click='zoom(2)'><i class='icon-zoom-out'></i> Zoom Out</a> | <a class='small' ng-click='zoom(2)'><i class='icon-zoom-out'></i> Zoom Out</a> |
</span> </span>
<span ng-show="panel.legend" ng-repeat='series in data' class="histogram-legend"> <span ng-show="panel.legend" ng-repeat='series in data' class="histogram-legend">
<i class='icon-circle' ng-style="{color: series.info.color}"></i> <i class='icon-circle' ng-style="{color: series.info.color}"></i>
...@@ -32,5 +32,5 @@ ...@@ -32,5 +32,5 @@
<span ng-show="panel.legend" class="small"><span ng-show="panel.value_field && panel.mode != 'count'">{{panel.value_field}}</span> {{panel.mode}} per <strong>{{panel.interval}}</strong> | (<strong>{{hits}}</strong> hits)</span> <span ng-show="panel.legend" class="small"><span ng-show="panel.value_field && panel.mode != 'count'">{{panel.value_field}}</span> {{panel.mode}} per <strong>{{panel.interval}}</strong> | (<strong>{{hits}}</strong> hits)</span>
</div> </div>
<center><img ng-show='panel.loading && _.isUndefined(data)' src="common/img/load_big.gif"></center> <center><img ng-show='panel.loading && _.isUndefined(data)' src="common/img/load_big.gif"></center>
<div histogram-chart class="histogram-chart" params="{{panel}}"></div> <div histogram-chart class="pointer histogram-chart" params="{{panel}}"></div>
</kibana-panel> </kibana-panel>
\ No newline at end of file \ No newline at end of file
panels/pie/module.html
...@@ -8,9 +8,9 @@ ...@@ -8,9 +8,9 @@
</div><br> </div><br>
<div style="clear:both"></div> <div style="clear:both"></div>
<div pie params="{{panel}}" style="position:relative"></div> <div pie class="pointer" params="{{panel}}" style="position:relative"></div>
<div ng-show="panel.legend == 'below'" ng-repeat="query in legend" style="float:left;padding-left: 10px;"> <div ng-show="panel.legend == 'below'" ng-repeat="query in legend" style="float:left;padding-left: 10px;">
<span ng-show='panel.chart != "none"'><i class="icon-circle" ng-style="{color:query.color}"></i></span><span class="small"> {{query.label}} ({{query.data[0][1]}}) </span></span> <span ng-show='panel.chart != "none"'><i class="icon-circle" ng-style="{color:query.color}"></i></span><span class="small"> {{query.label}} ({{query.data[0][1]}}) </span></span>
</div> </div>
</kibana-panel> </kibana-panel>
\ No newline at end of file \ No newline at end of file
panels/terms/module.html
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
<!-- START Pie or bar chart --> <!-- START Pie or bar chart -->
<div ng-show="panel.counter_pos == 'above' && (panel.chart == 'bar' || panel.chart == 'pie')" id='{{$id}}-legend'> <div ng-show="panel.counter_pos == 'above' && (panel.chart == 'bar' || panel.chart == 'pie')" id='{{$id}}-legend'>
<!-- vertical legend above --> <!-- vertical legend above -->
<table class="small" ng-show="panel.arrangement == 'vertical'"> <table class="small" ng-show="panel.arrangement == 'vertical'">
<tr ng-repeat="term in legend"> <tr ng-repeat="term in legend">
<td><i class="icon-circle" ng-style="{color:term.color}"></i></td> <td style="padding-right:10px;padding-left:10px;">{{term.label}}</td><td>{{term.data[0][1]}}</td> <td><i class="icon-circle" ng-style="{color:term.color}"></i></td> <td style="padding-right:10px;padding-left:10px;">{{term.label}}</td><td>{{term.data[0][1]}}</td>
</tr> </tr>
...@@ -21,11 +21,11 @@ ...@@ -21,11 +21,11 @@
<!-- keep legend from over lapping --> <!-- keep legend from over lapping -->
<div style="clear:both"></div> <div style="clear:both"></div>
<div ng-show="panel.chart == 'pie' || panel.chart == 'bar'" terms-chart params="{{panel}}" style="position:relative"></div> <div ng-show="panel.chart == 'pie' || panel.chart == 'bar'" terms-chart params="{{panel}}" style="position:relative" class="pointer"></div>
<div ng-show="panel.counter_pos == 'below' && (panel.chart == 'bar' || panel.chart == 'pie')" id='{{$id}}-legend'> <div ng-show="panel.counter_pos == 'below' && (panel.chart == 'bar' || panel.chart == 'pie')" id='{{$id}}-legend'>
<!-- vertical legend below --> <!-- vertical legend below -->
<table class="small" ng-show="panel.arrangement == 'vertical'"> <table class="small" ng-show="panel.arrangement == 'vertical'">
<tr ng-repeat="term in legend"> <tr ng-repeat="term in legend">
<td><i class="icon-circle" ng-style="{color:term.color}"></i></i></td> <td style="padding-right:10px;padding-left:10px;">{{term.label}}</td><td>{{term.data[0][1]}}</td> <td><i class="icon-circle" ng-style="{color:term.color}"></i></i></td> <td style="padding-right:10px;padding-left:10px;">{{term.label}}</td><td>{{term.data[0][1]}}</td>
</tr> </tr>
...@@ -39,7 +39,7 @@ ...@@ -39,7 +39,7 @@
</div> </div>
<!-- END Pie or Bar chart --> <!-- END Pie or Bar chart -->
<table ng-style="panel.style" class="table table-striped table-condensed" ng-show="panel.chart == 'table'"> <table ng-style="panel.style" class="table table-striped table-condensed" ng-show="panel.chart == 'table'">
<thead> <thead>
<th>Term</th> <th>Count</th> <th>Action</th> <th>Term</th> <th>Count</th> <th>Action</th>
</thead> </thead>
...@@ -48,11 +48,11 @@ ...@@ -48,11 +48,11 @@
<td>{{term.data[0][1]}}</td> <td>{{term.data[0][1]}}</td>
<td> <td>
<span ng-hide="term.meta == 'other'"> <span ng-hide="term.meta == 'other'">
<i class='icon-search pointer' ng-click="build_search(term)"></i> <i class='icon-search pointer' ng-click="build_search(term)"></i>
<i class='icon-ban-circle pointer' ng-click="build_search(term,true)"></i> <i class='icon-ban-circle pointer' ng-click="build_search(term,true)"></i>
</span> </span>
</td> </td>
</tr> </tr>
</table> </table>
</kibana-panel> </kibana-panel>
\ No newline at end of file \ No newline at end of file
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