jqplot et l'option de légende issue

Question

J'ai ce qui suit dans mon code. Avoir l'option

legend: {show:true} 

salit le graphique mal. La section de légende est si longue et il n'y a pas de graphique. J'ai collé l'image ici de la façon dont le tableau ressemble: http://tinypic.com/view.php?pic=2eqgbgy&s=7

Il montre bien sans l'option de légende si, mais graphique est bien sûr sans la légende.

Dans Chrome, je vois l'exception suivante Uncaught Erreur: INDEX_SIZE_ERR: DOM Exception 1

<script type="text/javascript"> 
     line2 = [['Living Expenses',1000], ['Loans',2000], ['Credit 
Card',500]]; 
    $j(document).ready(function() { 
     $j.jqplot.config.enablePlugins = true; 
     $j.jqplot('piechartdiv', [line2], { 
      title: 'Where is my money going?', 
      seriesDefaults:{renderer:$j.jqplot.PieRenderer, 
rendererOptions:{sliceMargin:8}}, legend:{show:true} 
     }); 
}); 

</script> 

<div style="width: 450px;margin: 0px auto;"> 
    <div id='piechartdiv'></div> 
</div> 

Toute aide appréciée.

Answer 1

La seule chose qui semble bizarre pour moi est la suivante:

$j.jqplot 

Pourquoi y at-il des J « s sur votre code ?, En outre, tout semble bien, peut-être essayer de mettre un emplacement sur la légende pour voir si cela résoudre le problème, voici un exemple:

plot = $.jqplot('chart2', [arr], { 
     grid: { 
      drawBorder: true, 
      drawGridlines: false, 
      background: '#FFFFFF', 
      shadow: true 
     }, 
     seriesDefaults: { 
      renderer: $.jqplot.PieRenderer, 
      rendererOptions: { 
       showDataLabels: true 
      } 
     }, 
     legend: { 
      show: true, 
      location: 'e' 
     } 
    }); 

Answer 2

Je suis tombé sur quelque chose de similaire. essayez de vérifier text-align propriété CSS: gauche

<div id='piechartdiv' style="text-align:left;"></div> 

Je crains que je ne sais pas pourquoi, mais ceux-ci fixe l'erreur pour moi

Answer 3

Utilisez-vous Bootstrap ou d'une autre bibliothèque de réinitialisation CSS?

Si vous allez dans Firebug et sélectionnez l'élément <table class="jqplot-table-legend" ...>, vous verrez probablement qu'il ya une propriété par défaut width:100% définir les éléments table. Vous pouvez le corriger dans votre mise en page CSS:

#piechartdiv table.jqplot-table-legend { 
    width:auto; 
} 

Answer 4

Avez-vous inclus le fichier jqplot.css dans votre code.

Assurez-vous qu'il est inclus dans le code et que le fichier est également présent dans le répertoire auquel vous faites référence.

Merci