dxChartの「引数フィールド」のソート基準は何ですか？

Question

私は、終了時にグラフのsyde-by-sydeバーで作業しています。「引数フィールド」の順序が間違っているのを見ました。正しい順序で送信していますが、チャートが乱れています。

このフィールドのソート方法については、ドキュメントには何も見つかりませんでした。私は誰かがそれを修正するためのトリックを知っている場合、とても感謝します。

は、ここに私のチャートとそのデータソースです：

var dataSource = [ 
    { state: "01-Aug-2017", Juan_Sebastián: 7,María_Alejandra: 3,José_Tomás: 8,}, 
    { state: "02-Aug-2017",Juan_Sebastián: 1,María_Alejandra: 2, }, 
    { state: "03-Aug-2017",María_Alejandra: 3,Juan_Sebastián: 2,José_Tomás: 4,}, 
    { state: "04-Aug-2017",José_Tomás: 2,Juan_Sebastián: 4,},                         
    { state: "08-Aug-2017",José_Tomás: 1, }, 
    { state: "09-Aug-2017",María_Alejandra: 1,José_Tomás: 2,},                                    
    { state: "10-Aug-2017",Juan_Sebastián: 1,},                             
    { state: "14-Aug-2017",José_Tomás: 1,María_Alejandra: 2,},                            
    { state: "15-Aug-2017",Juan_Sebastián: 1,},                             
    { state: "16-Aug-2017",Juan_Sebastián: 1,José_Tomás: 2, },                          
    { state: "17-Aug-2017",María_Alejandra: 1,},                             
]; 

$("#bar-2").dxChart({ 
    equalBarWidth: false, 
    dataSource: dataSource, 
    commonSeriesSettings: { 
    argumentField: "state", 
    type: "bar" 
}, 
    series: [ 
{ valueField: "Juan_Sebastián", name: "Juan Sebastián"}, 
{ valueField: "María_Alejandra", name: "María Alejandra"}, 
{ valueField: "José_Tomás", name: "José Tomás"}, 

], 
legend: { 
    verticalAlignment: "bottom", 
    horizontalAlignment: "center"}, 
title: "Cantidad de casos por abogado" 
            }); 
           }); 

そしてこれは、それがどのように見えるかです：

私は本当に、元のデータソースの順序を変更している理由を知りません。 多くのありがとう！

Answer 1

上記のチャートとデータソースのコードをjsFiddleとここでコードスニペットで実行すると、すべてが正しいように見えます。

https://jsfiddle.net/jmarking/089j1hrs/

var dataSource = [{ 
 
    state: "01-Aug-2017", 
 
    Juan_Sebastián: 7, 
 
    María_Alejandra: 3, 
 
    José_Tomás: 8, 
 
    }, 
 
    { 
 
    state: "02-Aug-2017", 
 
    Juan_Sebastián: 1, 
 
    María_Alejandra: 2, 
 
    }, 
 
    { 
 
    state: "03-Aug-2017", 
 
    María_Alejandra: 3, 
 
    Juan_Sebastián: 2, 
 
    José_Tomás: 4, 
 
    }, 
 
    { 
 
    state: "04-Aug-2017", 
 
    José_Tomás: 2, 
 
    Juan_Sebastián: 4, 
 
    }, 
 
    { 
 
    state: "08-Aug-2017", 
 
    José_Tomás: 1, 
 
    }, 
 
    { 
 
    state: "09-Aug-2017", 
 
    María_Alejandra: 1, 
 
    José_Tomás: 2, 
 
    }, 
 
    { 
 
    state: "10-Aug-2017", 
 
    Juan_Sebastián: 1, 
 
    }, 
 
    { 
 
    state: "14-Aug-2017", 
 
    José_Tomás: 1, 
 
    María_Alejandra: 2, 
 
    }, 
 
    { 
 
    state: "15-Aug-2017", 
 
    Juan_Sebastián: 1, 
 
    }, 
 
    { 
 
    state: "16-Aug-2017", 
 
    Juan_Sebastián: 1, 
 
    José_Tomás: 2, 
 
    }, 
 
    { 
 
    state: "17-Aug-2017", 
 
    María_Alejandra: 1, 
 
    }, 
 
]; 
 

 
$("#bar-2").dxChart({ 
 
    equalBarWidth: false, 
 
    dataSource: dataSource, 
 
    commonSeriesSettings: { 
 
    argumentField: "state", 
 
    type: "bar" 
 
    }, 
 
    series: [{ 
 
     valueField: "Juan_Sebastián", 
 
     name: "Juan Sebastián" 
 
    }, 
 
    { 
 
     valueField: "María_Alejandra", 
 
     name: "María Alejandra" 
 
    }, 
 
    { 
 
     valueField: "José_Tomás", 
 
     name: "José Tomás" 
 
    }, 
 

 
    ], 
 
    legend: { 
 
    verticalAlignment: "bottom", 
 
    horizontalAlignment: "center" 
 
    }, 
 
    title: "Cantidad de casos por abogado" 
 
});

<script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.1.0.min.js"></script> 
 
<link rel="stylesheet" type="text/css" href="https://cdn3.devexpress.com/jslib/17.1.6/css/dx.common.css" /> 
 
<link rel="stylesheet" type="text/css" href="https://cdn3.devexpress.com/jslib/17.1.6/css/dx.light.css" /> 
 
<script type="text/javascript" src="https://cdn3.devexpress.com/jslib/17.1.6/js/dx.all.js"></script> 
 
<div id="bar-2"></div>