Affichage des graphiques
Affichage des graphiques
Bonsoir
Une demande :
Pour que les graphiques soient lisibles sur une page design, il faut qu'ils soient assez grands, donc encombrant très fortement une page.
Serait 'il possible et intéressant d'avoir une fonction qui permette que lorsque l'on clique sur un graphique celui s'ouvre dans une page 3/4 écran, un peu comme modale du plugin Clink ?
Merci
Une demande :
Pour que les graphiques soient lisibles sur une page design, il faut qu'ils soient assez grands, donc encombrant très fortement une page.
Serait 'il possible et intéressant d'avoir une fonction qui permette que lorsque l'on clique sur un graphique celui s'ouvre dans une page 3/4 écran, un peu comme modale du plugin Clink ?
Merci
Jeedom - Debian 9.9 - Hp CQ-10 600 1.66GHz Intel Atom Processor N455 / SSD 32go / RAM 1go
RFXtrx433E USB
Gateway Xiaomi
Téléinfos via Nodemcu ESP8266
Branche Stable
Liste matériel : https://www.jeedom.fr/forum/memberlist. ... file&u=144
RFXtrx433E USB
Gateway Xiaomi
Téléinfos via Nodemcu ESP8266
Branche Stable
Liste matériel : https://www.jeedom.fr/forum/memberlist. ... file&u=144
Re: Affichage des graphiques
Tu peux faire cela via les objets "zone" de la page design.
Re: Affichage des graphiques
Merci
J'ai vu cette fonction, mais je peux avec afficher un équipement, mais un graphique, je ne vois pas....
Jeedom - Debian 9.9 - Hp CQ-10 600 1.66GHz Intel Atom Processor N455 / SSD 32go / RAM 1go
RFXtrx433E USB
Gateway Xiaomi
Téléinfos via Nodemcu ESP8266
Branche Stable
Liste matériel : https://www.jeedom.fr/forum/memberlist. ... file&u=144
RFXtrx433E USB
Gateway Xiaomi
Téléinfos via Nodemcu ESP8266
Branche Stable
Liste matériel : https://www.jeedom.fr/forum/memberlist. ... file&u=144
Re: Affichage des graphiques
En créant le graphique en question dans une vue, vue que tu affiches à partir de ta zone en utilisant un cliclink
Re: Affichage des graphiques
J'avais bien pensé à cette solution, mais je ne voulais faire que par le design....
Jeedom - Debian 9.9 - Hp CQ-10 600 1.66GHz Intel Atom Processor N455 / SSD 32go / RAM 1go
RFXtrx433E USB
Gateway Xiaomi
Téléinfos via Nodemcu ESP8266
Branche Stable
Liste matériel : https://www.jeedom.fr/forum/memberlist. ... file&u=144
RFXtrx433E USB
Gateway Xiaomi
Téléinfos via Nodemcu ESP8266
Branche Stable
Liste matériel : https://www.jeedom.fr/forum/memberlist. ... file&u=144
Re: Affichage des graphiques
tous n'est qu'une histoire de widget
qui ouvre un modal
du temps où clink n'existait pas
ouverture fichier html (que j'ai gardé des fois que) donc après adaptation si tu veux je dois encore faire des test
qui ouvre un modal
du temps où clink n'existait pas
ouverture fichier html (que j'ai gardé des fois que) donc après adaptation si tu veux je dois encore faire des test
Re: Affichage des graphiques
Merci winhex
C'est donc un widget complètement ré écris pour ouvrir une fenêtre avec le graphique.
Là, je ne sais absolument pas faire...
SI tu as l'occasion d'affiner et d'expliquer, je suis preneur.
Merci
C'est donc un widget complètement ré écris pour ouvrir une fenêtre avec le graphique.
Là, je ne sais absolument pas faire...
SI tu as l'occasion d'affiner et d'expliquer, je suis preneur.
Merci
Jeedom - Debian 9.9 - Hp CQ-10 600 1.66GHz Intel Atom Processor N455 / SSD 32go / RAM 1go
RFXtrx433E USB
Gateway Xiaomi
Téléinfos via Nodemcu ESP8266
Branche Stable
Liste matériel : https://www.jeedom.fr/forum/memberlist. ... file&u=144
RFXtrx433E USB
Gateway Xiaomi
Téléinfos via Nodemcu ESP8266
Branche Stable
Liste matériel : https://www.jeedom.fr/forum/memberlist. ... file&u=144
Re: Affichage des graphiques
avoir un historique d'une autre info
qui existe en tuto
viewtopic.php?f=29&t=29658&p=515968&hilit=tuto#p515968
donc pour une action défault "change #popupUrl# par ton l'id d'un equipement ex : 1011"
et pour une personnalisation et plein écran comme tu as au dessus
à toi de continuer avec se qu'on trouve sur différents sites.
j'ai pas été plus avancé depuis :
le défaut actuel une fois que tu clic sur le plein écran les autres historiques sont vide il faut réactualisé ta page.
Code : Tout sélectionner
$('.cmd[data-cmd_id=#id#] .state').on('click', function(){
$('#md_modal').dialog({title: "Historique" });
$("#md_modal").load('index.php?v=d&modal=cmd.history&id=75').dialog('open');
});
viewtopic.php?f=29&t=29658&p=515968&hilit=tuto#p515968
donc pour une action défault "change #popupUrl# par ton l'id d'un equipement ex : 1011"
Code : Tout sélectionner
<!-- Trigger the modal with a button -->
<button type="button" id="fs-doc-button" class="btn btn-success openBtn#id#">#name_display#</button>
<!-- Modal -->
<div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog modal-lg">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title" style="color:black;"></h4>
</div>
<div class="modal-body">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
<script>
$('.openBtn#id#').on('click',function(){
$('#md_modal').dialog({title: "Historique ID #popupUrl# #name_display#" });
$("#md_modal").load('index.php?v=d&modal=cmd.history&id=#popupUrl#').dialog('open');
});
</script>
<style>
</style>
</div>
Code : Tout sélectionner
<body>
<style>
.modal-header, h4, .close {
background-color: #5cb85c;
color:white;
text-align: center;
font-size: 30px;
}
.modal-footer {
background-color: #f9f9f9;
}
.modal-title {
color: white;
text-shadow: 1px 1px 2px black, 0 0 25px blue, 0 0 5px darkblue;
}
.modal-dialog {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
.modal-content {
height: auto;
min-height: 100%;
border: none;
border-radius: 0;
}
.modal-content .close {
position: absolute;
top: 10px;
right: 20px;
font-size: 50px;
font-weight: normal;
}
.modal-body {
position: absolute;
padding: 0px;
height: 100%;
}
</style>
<!-- Trigger the modal with a button -->
<div class="btn btn-xs btn-default action cmdName openBtn#id#" data-toggle="modal" style="margin-top: 5px; border: none;border-radius: 0px; color: black" data-target="myModal#id#">#name#</div>
<!-- Modal -->
<div class="modal fade" id="myModal#id#" role="dialog">
<div class="modal-dialog modal-lg">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Historique ID #popupUrl# #name_display#</h4>
</div>
<div class="modal-body embed-responsive embed-responsive-16by9">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<script>
$('.openBtn#id#').on('click',function(){
$('.modal-body').load('index.php?v=d&modal=cmd.history&id=#popupUrl#',function(){
$('#myModal#id#').modal({show:true});
});
});
</script>
</body>
j'ai pas été plus avancé depuis :
le défaut actuel une fois que tu clic sur le plein écran les autres historiques sont vide il faut réactualisé ta page.
Re: Affichage des graphiques
Merci winhex
Je vais voir ce que je peux en faire.
Je vais voir ce que je peux en faire.
Jeedom - Debian 9.9 - Hp CQ-10 600 1.66GHz Intel Atom Processor N455 / SSD 32go / RAM 1go
RFXtrx433E USB
Gateway Xiaomi
Téléinfos via Nodemcu ESP8266
Branche Stable
Liste matériel : https://www.jeedom.fr/forum/memberlist. ... file&u=144
RFXtrx433E USB
Gateway Xiaomi
Téléinfos via Nodemcu ESP8266
Branche Stable
Liste matériel : https://www.jeedom.fr/forum/memberlist. ... file&u=144
Re: Affichage des graphiques
Je ne voulais pas ouvrir un post dessus, mais ma recherche m'a conduit ici.
Je souhaiterai enlever le bouton export et le cadre d'un graphique en mode design.
Au mieux voilà ce que j'ai ... une idée ?
Avec de tels réglages :
Ce serait intéressant de pousser le réglage un peu plus loin non ?
Je souhaiterai enlever le bouton export et le cadre d'un graphique en mode design.
Au mieux voilà ce que j'ai ... une idée ?
Avec de tels réglages :
Ce serait intéressant de pousser le réglage un peu plus loin non ?
Re: Affichage des graphiques
Salut,
pour le cadre dans "Bordure" tu ajoute 0px pour le reste je ne pense pas que ce soit possible a moins de bidouiller.
pour le cadre dans "Bordure" tu ajoute 0px pour le reste je ne pense pas que ce soit possible a moins de bidouiller.
Re: Affichage des graphiques
C'est pas aussi c*n que ça quand même lol...
Merci!
Envoyé de mon Moto G (5S) Plus en utilisant Tapatalk
Merci!
Envoyé de mon Moto G (5S) Plus en utilisant Tapatalk
Re: Affichage des graphiques
tu caches la classe
<script>
$('.highcharts-button-symbol').hide();
</script>
en création html sur la même page
tu pourrais le faire en css aussi
methode :
avec chrome
outils de developpement
dans la tabs le premier icone à gauche et ensuite tu proménes ta souris
<script>
$('.highcharts-button-symbol').hide();
</script>
en création html sur la même page
tu pourrais le faire en css aussi
Code : Tout sélectionner
.highcharts-button-symbol
{
display:none;
}
avec chrome
outils de developpement
dans la tabs le premier icone à gauche et ensuite tu proménes ta souris
Dernière édition par winhex le 02 mai 2018, 20:32, édité 2 fois.
Re: Affichage des graphiques
Super merci
Il faut rajouter la classe highcharts-button-box pour supprimer le bouton du dessous
Il faut rajouter la classe highcharts-button-box pour supprimer le bouton du dessous
Code : Tout sélectionner
.highcharts-button-box
{
display:none;
}
Re: Affichage des graphiques
Bonjour,
Est-ce que vous pouvez me dire à quel endroit exact dans Jeedom ces codes pour pouvoir modifier les graph sous Highcharts doivent être tapé.
J'ai pas mal travaillé avec highcharts pour d'autre projets mais là avec son intégration dans Jeedom, je suis un peu perdu.
Merci d'avance à celles et ceux qui pourront m'éclairer
Est-ce que vous pouvez me dire à quel endroit exact dans Jeedom ces codes pour pouvoir modifier les graph sous Highcharts doivent être tapé.
J'ai pas mal travaillé avec highcharts pour d'autre projets mais là avec son intégration dans Jeedom, je suis un peu perdu.
Merci d'avance à celles et ceux qui pourront m'éclairer
Re: Affichage des graphiques
J'étais tenté de faire un :
Mais ça ne change rien sur mes graphs de la page en cours...
Là ça dépasse mes compétences.
Code : Tout sélectionner
<script>
.highcharts-button-box
{
display:none;
}
</script>
Là ça dépasse mes compétences.
Re: Affichage des graphiques
c'est pas entre script !
c'est du style css donc entre <style>
---
quand tu vois le script
$('.highcharts-button-symbol').hide();
==
pour une class toujours un . devant
pour style ou script (un id c'est #)
.highcharts-button-symbol
.hide pour la cmd jquery "caché"
la même commande style en jquery
serait
$('.highcharts-button-symbol').css( 'display' ,'none');
https://www.w3schools.com/jquery/jquery_css.asp
--
pour 1 seul en script sans tester se serai
$('[data-eqlogic_id="132"] .highcharts-button-symbol').css('display','none');
donc en style
data-eqlogic_id="132" .highcharts-button-symbol{
display: none;
}
HS
une façon de ne pas voir une tuile (sans clic possible pour celle du dessous)
$('[data-eqlogic_id="132"]').css('display' , 'none')
c'est du style css donc entre <style>
---
quand tu vois le script
$('.highcharts-button-symbol').hide();
==
pour une class toujours un . devant
pour style ou script (un id c'est #)
.highcharts-button-symbol
.hide pour la cmd jquery "caché"
la même commande style en jquery
serait
$('.highcharts-button-symbol').css( 'display' ,'none');
https://www.w3schools.com/jquery/jquery_css.asp
--
pour 1 seul en script sans tester se serai
$('[data-eqlogic_id="132"] .highcharts-button-symbol').css('display','none');
donc en style
data-eqlogic_id="132" .highcharts-button-symbol{
display: none;
}
HS
une façon de ne pas voir une tuile (sans clic possible pour celle du dessous)
$('[data-eqlogic_id="132"]').css('display' , 'none')
Re: Affichage des graphiques
Salut @winhex,
J'ai identifié quelques classes à cacher sur mes graphiques et j'aimerais que cela se fasse sur la seule page dans laquelle j'ai placé le script. (je veux pouvoir avoir des styles de graphiques différents sur les autres pages de design par exemple).
Sauf que je n'ai pas compris ou placer le code <script> ... </script>
Sur ma page design, j'ai ajouté un 'Texte/html' et je tape dans la zone texte le code SCRIPT mais ça ne semble pas efficace...
La seule chose qui fonctionne, c'est de placer du CSS dans la personnalisation avancée de JEEDOM mais du coup, tous les graphiques sont affectés !
Une idée ? Heeelp svp
Re: Affichage des graphiques
un script se déroule , je regarderai
sinon en css
personnalisation id / design précédant
[data-eqlogic_id="96"].highcharts-button-symbol
viewtopic.php?f=50&t=15104&hilit=person ... 00#p648937
ou
viewtopic.php?f=24&t=31450&p=674138#p674138
sinon en css
personnalisation id / design précédant
[data-eqlogic_id="96"].highcharts-button-symbol
viewtopic.php?f=50&t=15104&hilit=person ... 00#p648937
ou
viewtopic.php?f=24&t=31450&p=674138#p674138
Qui est en ligne ?
Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 1 invité