IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

jQuery Discussion :

JQPlot - mise à jour dynamique des tickOptions d'un DateAxisRenderer


Sujet :

jQuery

  1. #1
    in
    in est déconnecté
    Membre expérimenté Avatar de in
    Profil pro
    Inscrit en
    avril 2003
    Messages
    1 612
    Détails du profil
    Informations personnelles :
    Localisation : France, Finistère (Bretagne)

    Informations forums :
    Inscription : avril 2003
    Messages : 1 612
    Points : 1 718
    Points
    1 718
    Par défaut JQPlot - mise à jour dynamique des tickOptions d'un DateAxisRenderer
    Bonjour,

    je construit un graphique avec JQPlot.
    Je voudrais, selon le nombre de ticks appliquer tel ou tel format ; par exemple si nbTicks > 20 alors angle:-30.

    J'ai des boutons (+,-, <, >) qui permettent de zoomer/scroller le graphique (en fait, à chaque clic, je met à jour le tableau "ticks" pour l'axe.

    J'arrive à faire fonctionner cela avec un renderer:CategoryAxisRenderer.
    Le problème est que je souhaite utiliser un DateAxisRenderer (pour le highlighter principalement) et que là ça ne fonctionne plus.
    Enfin ça fonctionne pour l'angle met je perds le formattage de la date.

    Le code appelé par les boutons (désolé c'est du JSNI à la base)
    displayedTicks est le tableau de ticks que j'affiche
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    private native void updateChartAxis(JavaScriptObject chart, JavaScriptObject displayedTicks) /*-{
     
    	if(displayedTicks.length > 16) {
                    // font-size et angle sont correctement appliqués
                    // par contre par le format
    		chart.axes.xaxis.tickOptions={formatString:'%d-%b-%y', fontSize: '6pt', angle:-30};
    		chart.axes.yaxis.tickOptions={fontSize: '6pt'};
    	} else {
    		chart.axes.xaxis.tickOptions={fontSize: '10pt', angle:0};
    		chart.axes.yaxis.tickOptions={fontSize: '10pt', angle:0};
    	}
     
    	chart.axes.xaxis.ticks = displayedTicks;
    	chart.axes.yaxis.ticks = displayedTicks;
     
    	chart.replot({resetAxes:true});
    	//chart.replot();
     
    	}-*/;
    et le code (raccourci) du graphique :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    public native JavaScriptObject createChart(String id, String chartTitle, JavaScriptObject dataString) /*-{
     
    	$wnd.jQuery.jqplot.config.enablePlugins = true;
     
    // j'ai également essayé ce genre de truc mais sans succès, ce n'est pas appelé ...
    //		$wnd.jQuery.jqplot.postDrawHooks.push(function() {
    //	        if(plot) {
    //	        	plot.axes.xaxis.tickOptions = {formatString:'%d-%b-%y', angle:-30};
    //	        }
    //    	});
    //		
     
    var plot = $wnd.jQuery.jqplot(id, dataString, {
    		             title:chartTitle
    		              ,legend:{
    			       renderer: $wnd.jQuery.jqplot.EnhancedLegendRenderer,
    		    	           show: true
    		    	           , placement:'outsideGrid'
    		    	           , rowSpacing: '0.5em'
    		    	           , fontSize: '8pt'
    		               }
    		               , highlighter: {
    				  show: true 
    				 , sizeAdjust: 7.5
    				 , tooltipAxes:'xy'
    				 , formatString:    '<table class="jqplot-highlighter"><tr><td colspan="2"><b>#serieLabel#</b></td></tr><tr><td>Date:</td><td>%s</td></tr><tr><td>End:</td><td>%s</td></tr></table>'
    				, useAxesFormatters:true
    				, tooltipLocation:'ne' 
    			       }
    				, cursor:{
    		    	    	  //...
    		    	        }
    		               ,seriesDefaults: {
    		    	          //...
    		    	       	}
    		               ,series:[
    	    	               //...
    		                 ]
    		               , axesDefaults: {
    		               		//renderer:$wnd.jQuery.jqplot.CategoryAxisRenderer
    		               		renderer:$wnd.jQuery.jqplot.DateAxisRenderer
    		               		,tickRenderer: $wnd.jQuery.jqplot.CanvasAxisTickRenderer
    		               		,tickOptions:{formatString:'%d-%b-%y'}
    		               }  
    		});
     
     
    		return plot;
    	}-*/;

    si qqu'un a une idée ?
    "If email had been around before the telephone was invented, people would have said, 'Hey, forget email! With this new telephone invention I can actually talk to people!"

    Besoin d'une nouvelle méthode pour développer ? -> http://www.la-rache.com/

  2. #2
    in
    in est déconnecté
    Membre expérimenté Avatar de in
    Profil pro
    Inscrit en
    avril 2003
    Messages
    1 612
    Détails du profil
    Informations personnelles :
    Localisation : France, Finistère (Bretagne)

    Informations forums :
    Inscription : avril 2003
    Messages : 1 612
    Points : 1 718
    Points
    1 718
    Par défaut
    bon, a priori, j'ai résolu le problème en forçant le "formatter"
    ce qui donne dans ma fonction de mise à jour des axes

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    chart.axes.xaxis.tickOptions={
           // force le formatter de DateAxisRenderer
           formatter:$wnd.jQuery.jqplot.DateTickFormatter 
         , formatString:'%d-%b-%y'
         , fontSize: '6pt', angle:-30
    };
    "If email had been around before the telephone was invented, people would have said, 'Hey, forget email! With this new telephone invention I can actually talk to people!"

    Besoin d'une nouvelle méthode pour développer ? -> http://www.la-rache.com/

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. [XL-2007] Mise à jour automatique des données d'un tableau croisé dynamique
    Par amapacha dans le forum Macros et VBA Excel
    Réponses: 3
    Dernier message: 19/09/2014, 15h39
  2. [MySQL] Mise à jour dynamique des lignes d'un tableau
    Par woodyfrance dans le forum PHP & Base de données
    Réponses: 1
    Dernier message: 29/02/2008, 12h50
  3. Mise à jour dynamique d'un champs
    Par Badiste dans le forum Général JavaScript
    Réponses: 6
    Dernier message: 10/10/2006, 16h18
  4. Word : Mise à jour automatique des liaisons
    Par tiftay01 dans le forum Word
    Réponses: 13
    Dernier message: 13/02/2006, 10h34
  5. [MFC] Mise à jour dimension des CDialogBar
    Par Kevgeii dans le forum MFC
    Réponses: 2
    Dernier message: 14/01/2004, 23h47

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo