jQuery Girl
  1. jQuery Girl
  3. jqplot – Valeurs individuelles, pas de totaux dans un graphique empilé
Intereting Posts
Jqgrid colonne gelée semble structure incorrecte Mélange de razor et de code de script java pour @ Html.Partial () Barre latérale fixe avec hauteur relative et transition fluide absolue Knockout Triable bind Order Modification de l’ordre des colonnes HTML sur une largeur spécifique Frais d’expédition dynamics basés sur des boutons radio personnalisés dans Woocommerce Boîte de recherche fixe avec suggestions de saisie semi-automatique Quel est le meilleur: chaîne html ou création d’élément DOM jQuery? jQuery: Publication d’un caprice de tableau avec des crochets ASP.NET MVC 4: impossible de modifier jQuery Unobtrusive Ajax Jquery live ralentit-il les sites Web? Comment jQuery désérialise JSON? jQuery – Change 1-24 heure en 1-12 heure en utilisant la méthode .getHours ()? L’utilisation de la fonction de basculement jQuery sur une ligne de table fait grossir la table elle-même Session de Codeigniter avec des appels ajax

jqplot – Valeurs individuelles, pas de totaux dans un graphique empilé

Dans un graphique à barres empilées, nous pouvons afficher le total de chaque série dans chaque stack, comme ceci actuel Cependant, je souhaite que la valeur de chaque série soit affichée, et non totale comme ceci (veuillez ignorer le fait que les deux échantillons ont un nombre différent de séries) voulu De plus, j’aimerais afficher le total de la stack en haut. Ce que je veux dire, c’est que si vous regardez le premier graphique, dans la première barre, les valeurs sont 5,15 (5 + 10), 24 (15 + 9). Le résultat souhaité doit ressembler au second graphique, où les valeurs de la première barre sont 10,9 et enfin le total se situe dans le haut de la plage.
Est-ce possible avec cette bibliothèque?

    Un peu de bidouille ici. Puisque vous voulez un label de plus pour chaque série, j’ai introduit une série “vide”. Il reproduit ce que vous voulez plutôt bien, cependant. Violon ici . 

    $(document).ready(function(){ var s1 = [5, 6]; var s2 = [7, 5]; var s3 = [14, 9]; var s4 = [0, 0]; //empty series just for total labels var pLabels1 = []; // arrays for each inner label var pLabels2 = []; var pLabels3 = []; var pLabelsTotal = []; // array of totals above each column for (var i = 0; i < s1.length; i++){ pLabels1.push('
    '+s1[i]+'
    '); pLabels2.push('
    '+s2[i]+'
    '); pLabels3.push('
    '+s3[i]+'
    '); pLabelsTotal.push(s1[i]+s2[i]+s3[i]); } plot3 = $.jqplot('chart2', [s1, s2, s3, s4], { // Tell the plot to stack the bars. stackSeries: true, captureRightClick: true, seriesDefaults:{ renderer:$.jqplot.BarRenderer, rendererOptions: { // Put a 30 pixel margin between bars. barMargin: 30, // Highlight bars when mouse button pressed. // Disables default highlighting on mouse over. highlightMouseDown: true }, }, series:[ { pointLabels:{ show:true, labels:pLabels1, ypadding: -25, escapeHTML:false } }, { pointLabels:{ show:true, labels:pLabels2, ypadding: -25, escapeHTML:false } }, { pointLabels:{ show:true, labels:pLabels3, ypadding: -25, escapeHTML:false } }, { pointLabels:{ show:true, labels:pLabelsTotal, ypadding: 7, escapeHTML:false } } ], axes: { xaxis: { renderer: $.jqplot.CategoryAxisRenderer }, yaxis: { padMin: 0, min: 0 } }, legend: { show: false, } }); });

    Produit:

    entrez la description de l'image ici