Varken Grafana Influxdb - projetssd/ssdv2 GitHub Wiki


Quelques explications

Lors de l'installation de Varken, seront également installés Grafana et Telegraf.

  • Varken: utilitaire autonome pour agréger les données de l'écosystème Plex dans InfluxDB.
  • Grafana: application web nous permettant d’afficher des graphiques selon des métriques enregistré dans une base de donnée sous le moteur Influxdb.
  • Telegraf: agent qui s’installe sur les serveurs et qui récupèrent des métriques selon les « inputs » définis dans ses fichiers de configurations. Il renvoie les différentes métriques vers les « outputs », les sorties définies dans la configuration de même.
  • Monitorr: application Web PHP auto-hébergée qui surveille l'état des services réseau, des sites Web, des applications locales et distantes.

1. Maxmind

Comment obtenir une clé de licence

1ère étape créer un compte (gratuit) chez MaxMind

Une fois le compte créé, il sera possible de générer une clé de licence.



Répondez non à la question ci-dessous et n'oubliez pas de copier votre key l'étape après avoir confirmé:

Maintenant on va lancer le script et coller la KEY:

Valider par Enter, le script poursuit son travail.

2. Grafana


user: admin
Pass: grafana

Configuration influxdb

Aller sur data sources


Cliquer sur Add data source


Choisir Influxdb


Configurer comme ci dessous



Recréer une 2ème base de donnée sur le même shéma que précédemment en changeant varken par telegraf, ce qui fait qu'au final vous disposerez de 2 bases de données influxdb: varken et telegraf

Pour terminer vous importez le dashboard unofficial de plex avec le n° id '9558'

Complément d'information sur la configuration

3. Monitorr

Une fois monitorr installé à partir du script, assurez vous vous qu'il est fonctionnel en tapant:
https:/monitorr.domain.com/assets/php/phpinfo.php
vous devriez tomber sur cette page



Accédez à https://monitorr.domain.com Vous verrez un avertissement indiquant "Répertoire de données NON détecté. Cliquer sur Monitorr setting



Cliquer sur Monitorr registration



Ensuite créer vos identifiants de connexion



Vous devriez obtenir ceci



Et enfin



Plus qu'à configurer, c’est très simple de rajouter des applis, suivez le modele de celles déjà présentes
Sources: https://github.com/Monitorr/Monitorr/wiki/01-Config:--Initial-configuration

4. Intégration Monitorr avec la Home page d'Organizr

A ajouter dans Éditeur/Éléments de la page d’accueil/CustomHTML-1

<div style="overflow:hidden;  height:255px">    
        <embed style="height:100%" width='100%' src='https://yourdomain.com/monitorr/index.min.php'/>
</div>
<br>

Vous pouvez régler (height:255px) pour ne pas avoir d’ascenseur dans la Home page, rafraichissez, vous obtenez

Imgur Image

Copier le script HTML ci dessous dans Éditeur/Éléments de la page d’accueil/CustomHTML-1 dessous le code précédemment intégré de monitorr

 <style>
.flex {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: center;
    background: transparent;
    box-shadow: none !important;
    transition: all .4s ease-in-out;
    cursor: pointer
}

/* -------------------Small widget------------------- */
.flex-child { padding: 3px; flex-grow: 1; flex-basis: 0;}
#grafanadwidget { position: relative; height: calc(80px); width: calc(100%);}
/* -------------------Small widget------------------- */

/* -------------------Big widget------------------- */
.flex-child-big { padding: 3px; flex-grow: 1; flex-basis: 0;}
#grafanadwidget-big { position: relative; height: calc(250px); width: calc(100%);}
/* -------------------Big widget------------------- */

/* -------------------iFrame Link------------------- */
.iframe-link { z-index:1; position:absolute; height: calc(80px); width: calc(100%); background-color: transparent; cursor: pointer}
/* -------------------iFrame Link------------------- */

#announcementRow { background-color:transparent !important;}
#announcementRow>h4 {
    padding-left: 15px;
    font-family: Rubik,sans-serif;
    margin: 10px 0;
    font-weight: 300 !important;
    line-height: 22px;
    font-size: 18px;
    color: #dce2ec;
}
.overflowhider { height: 100%; overflow: hidden;}
@media only screen and (max-width: 650px) {.flex-child-big {flex-basis: auto;min-width: auto !important;}}
@media only screen and (max-width: 1125px) {.flex-child-big {flex-basis: auto;min-width: 600px;flex-basis: fit-content;}}
@media only screen and (max-width: 1649px) {.flex-child {flex-basis: auto;}}
</style>

<!-- -------------------ADD TITLE HERE------------------- -->
<div id="announcementRow" class="row"><h4 class="pull-left">
    <span>Grafana</span></h4><hr class="hidden-xs"></div>

<!-- -------------------SMALL WIDGET START------------------- -->
    <div class="content-box flex">
    <!-- -------------------WIDGET------------------- -->
    <div class="flex-child" id="flex-grafanadwidget">
    <div class="overflowhider">
    <iframe class="iframe" id="grafanadwidget" 
    frameborder="0" src="ADD-URL-TO-GRAFANA-PANEL-HERE"></iframe>
    </div></div>
    <!-- -------------------WIDGET------------------- --> 
    <div class="flex-child" id="flex-grafanadwidget">
    <div class="overflowhider">
    <iframe class="iframe" id="grafanadwidget" 
    frameborder="0" src="ADD-URL-TO-GRAFANA-PANEL-HERE"></iframe>
    </div></div>
    <!-- -------------------WIDGET------------------- -->     
    <div class="flex-child" id="flex-grafanadwidget">
    <div class="overflowhider">
    <iframe class="iframe" id="grafanadwidget" 
    frameborder="0" src="ADD-URL-TO-GRAFANA-PANEL-HERE"></iframe>
    </div></div>
    <!-- -------------------WIDGET------------------- --> 
    <div class="flex-child" id="flex-grafanadwidget">
    <div class="overflowhider">
    <iframe class="iframe" id="grafanadwidget" 
    frameborder="0" src="ADD-URL-TO-GRAFANA-PANEL-HERE"></iframe>
    </div></div>
    <!-- -------------------WIDGET------------------- -->     
    <div class="flex-child" id="flex-grafanadwidget">
    <div class="overflowhider">
    <iframe class="iframe" id="grafanadwidget" 
    frameborder="0" src="ADD-URL-TO-GRAFANA-PANEL-HERE"></iframe>
    </div></div>
    <!-- -------------------WIDGET------------------- -->     
    <div class="flex-child" id="flex-grafanadwidget">
    <div class="overflowhider">
    <iframe class="flex" id="grafanadwidget" 
    frameborder="0" src="ADD-URL-TO-GRAFANA-PANEL-HERE"></iframe>
    </div></div>
</div>
<!-- -------------------SMALL WIDGET END------------------- -->

<!-- -------------------BIG WIDGET START------------------- -->   
<div class="content-box flex">
    <!-- -------------------BIG WIDGET------------------- -->        
    <div class="flex-child-big" id="flex-grafanadwidget-big">
    <div class="overflowhider">
    <iframe class="flex" id="grafanadwidget-big" frameborder="0" 
    frameborder="0" src="ADD-URL-TO-GRAFANA-PANEL-HERE"></iframe>
    </div></div>
    <!-- -------------------BIG WIDGET------------------- -->     
    <div class="flex-child-big" id="flex-grafanadwidget-big">
    <div class="overflowhider">
    <iframe class="iframe" id="grafanadwidget-big" frameborder="0" 
    frameborder="0" src="ADD-URL-TO-GRAFANA-PANEL-HERE"></iframe>
    </div></div>
    <!-- -------------------BIG WIDGET------------------- -->     
    <div class="flex-child-big" id="flex-grafanadwidget-big">
    <div class="overflowhider">
    <iframe class="iframe" id="grafanadwidget-big" frameborder="0" 
    frameborder="0" src="ADD-URL-TO-GRAFANA-PANEL-HERE"></iframe>
    </div></div>   
</div>
<!-- -------------------BIG WIDGET END------------------- --> 

Comme vous pouvez le constater, 6 blocs sont réserves pour des petits widgets et 3 pour des plus gros. L'idée est de modifier les emplacements
ADD-URL-TO-GRAFANA-PANEL-HERE  

En mettant l'adresse du panel récupéré dans Grafana ainsi que

TAB-NAME-HERE  

Par le nom de la table créée dans Oganizr.

Par défaut on utilise l'adresse suivante

src='https://grafana.domain.com/d-solo/bj0JnBMmz/org-dash?refresh=5s&orgId=1&panelId=22'/>  

Pour

ADD-URL-TO-GRAFANA-PANEL-HERE  


On modifie simplement le numéro de panelId par celui correspondant au panel que nous souhaitons afficher. Pour récupérer le numéro du panel on clique sur la petite flèche du panel puis Share/Embed on obtient ça:



Ce qui nous intéresse c est le numéro 38 que l'on remplace dans

src='https://grafana.domain.com/d-solo/bj0JnBMmz/org-dash?refresh=5s&orgId=1&panelId=38'/>  

Voilà mon Dashboard mais vous pouvez construire ce que vous voulez intégrant des metrics avec telegraf ou bien des données de Netdata

Imgur Image

Ajouter des onglets à Monitorr

Rendez-vous sur Services configuration de Monitorr: https://monitorr.ndd.tld/settings.php#services-configuration

  • Add Service: ajouter un service
  • Remove Service: supprimer le service
  • Move Up: monter un service dans l'ordre d'apparence
  • Move Down: descendre un service dans l'ordre d'apparence
  • Clear: supprimer les données déjà entrées dans le service
  • Images: sélectionner et/ou ajouter l'icône d'un service

  • Service title: Rutorrent
  • Enabled: oui, on l'active
  • Service image: un grand choix d'icônes est présent, (il suffira de copier le code de l'image), mais vous pouvez aussi en ajouter.
  • Check type: standard
  • Ping RT:
  • Link Enabled: si vous voulez que l'icône soit cliquable et mène à la page web correspondante
  • Check URL: https://rutorrent.VOTRE_DOMAINE.tld:443
  • Service URL: https://rutorrent.VOTRE_DOMAINE.tld:443

Corriger l'erreur grafana-worldmap-panel

rm -rf /opt/seedbox/docker/tjmm/grafana/plugins/grafana-worldmap-panel

wget https://github.com/grafana/worldmap-panel/releases/download/v0.3.0/grafana-worldmap-panel-0.3.0.zip

Mais vérifier s’il n’y a pas une nouvelle version ici.

unzip grafana-worldmap-panel-0.3.0.zip

rm -rf grafana-worldmap-panel-0.3.0.zip

chown -R 472:472 grafana-worldmap-panel

docker restart grafana

⚠️ **GitHub.com Fallback** ⚠️