c3 Charts Auftrag funktioniert nicht in Safari

Question

C3 Charts Auftrag Funktion für gestapelte Balkendiagramm arbeitet in Chrome und Firefox, aber in Safari und IE, Reihenfolge der Daten in bar ist umgekehrt. Hier ist die Demo

https://jsfiddle.net/shru8051/wp520y8j/

<div id="chart"></div> 

var chart = c3.generate({ 
    data: { 
     columns: [ 
      ['MONETARY', 11340, 3259], 
      ['NON-MONETARY', 12335, 18041] 
     ], 
     type: 'bar', 
     groups: [ 
      ['MONETARY','NON-MONETARY'] 
     ], 
     order:function(t1,t2){return true}, 
    }, 

    axis: { 
     x: { 
      type: 'category', 
      categories: ['DENTIST', 'PROGRAMMER/ANALYST'] 
     } 
    } 
}); 

Answer 1

Ihre order Funktion ist falsch:

order:function(t1,t2){ return true }

Nach the documentation

data.order

Definieren Sie die Reihenfolge der Daten.

Diese Option ändert die Reihenfolge des Stapelns der Daten und Teile von Kuchen/Donut. Wenn null angegeben ist, wird dies die Reihenfolge sein, in der die Daten geladen wurden. Wenn die Funktion angegeben ist, wird sie zum Sortieren der Daten verwendet, und sie erhält die Daten als Argument.

Für mich in Chrome beim Schweben über Bar-Elemente in Tooltip ständig wechseln Orte. Es ist wegen dir order Funktion immer zurück true. Wenn Sie auf blau rect wollen (Monetary) platziert über orange rect (Non monetary), können Sie einfach umschreiben order Eigenschaft auf diese Weise:

order: function(v1, v2) { 
    return dataOrder.indexOf(v1.id) < dataOrder.indexOf(v2.id) ? 1 : -1 
} 

Wo dataOrder ist var dataOrder = ['MONETARY', 'NON-MONETARY'];

prüfen diese Gabeln Ihrer Geige in Safari und IE - https://jsfiddle.net/y0qLnvv4/6/