D3ディンプルカテゴリ軸の順序を修正するにはどうすればよいですか？

Question

私は以下のように見える元のデータセットを持っている...

var dataSet3 = [ 
    { "Month": "January", "Date": "20150101", "Unit Sales": "3000", "Revenue": "2000" }, 
    //{ "Month": "January", "Date": "20150103", "Unit Sales": "3000", "Revenue": "2000" }, 
    { "Month": "April", "Date": "20150403", "Unit Sales": "500", "Revenue": "6000" }, 
    //{ "Month": "April", "Date": "20150403", "Unit Sales": "500", "Revenue": "6000" }, 
    { "Month": "May", "Date": "20150530", "Unit Sales": "3000", "Revenue": "2000" }, 
    { "Month": "June", "Date": "20150620", "Unit Sales": "1500", "Revenue": "39000" }, 
    { "Month": "July", "Date": "20150706", "Unit Sales": "2500", "Revenue": "6000" }, 
    { "Month": "February", "Date": "20150205", "Unit Sales": "2500", "Revenue": "5000" }, 
    { "Month": "March", "Date": "20150307", "Unit Sales": "1500", "Revenue": "6000" }, 
    { "Month": "August", "Date": "20150816", "Unit Sales": "2500", "Revenue": "20000" }, 
    { "Month": "September", "Date": "20150907", "Unit Sales": "1500", "Revenue": "6000" }, 
    { "Month": "October", "Date": "20151009", "Unit Sales": "500", "Revenue": "9000" }, 
    { "Month": "November", "Date": "20151120", "Unit Sales": "50", "Revenue": "15000" }, 
    { "Month": "December", "Date": "20151222", "Unit Sales": "2000", "Revenue": "7000" } 
    ]; 

次のように私のHTMLに見える...

<div class="div_RootBody" id="root_div"> 
    <h3>Example 4</h3> 
    <div id="chart4"></div> 
</div> 

マイディンプルチャートコードは次のとおりです。

function draw2(selectString, data){ 

    //var svg2 = dimple.newSvg("#chart2", 690, 420); // width x height 
    var svg2 = dimple.newSvg(selectString, 690, 420); // width x height 
    var myChart = new dimple.chart(svg2); 
    myChart.setBounds(60, 30, 505, 305); 
    var x = myChart.addCategoryAxis("x", "Month"); 
    x.addOrderRule("Date"); 

    var y1 = myChart.addMeasureAxis("y", "Unit Sales"); 
    var y2 = myChart.addMeasureAxis("y", "Revenue"); 

    var line1 = myChart.addSeries("Sales", dimple.plot.line, [x,y1]); 
    var line2 = myChart.addSeries("Gross Revenue", dimple.plot.line, [x,y2]); 

    //line1.data = dataSet1; 
    line1.data = data; 
    line1.plot=dimple.plot.line; 
    //line2.data = dataSet1; 
    line2.data = data; 
    line2.plot=dimple.plot.line; 

    // Assign specific colors to lines 
    myChart.assignColor("Sales", "blue"); 
    myChart.assignColor("Gross Revenue", "green"); 
    line1.lineMarkers = true; 
    line2.lineMarkers = true; 

    myChart.addLegend(180, 10, 260, 20, "right", line1); 
    myChart.addLegend(180, 10, 360, 20, "right", line2); 

    myChart.draw(); 

    }; 

そして、私はラインを使ってディンプルチャーティングコードと呼んでいます...

draw2("#chart4", dataSet3); 

私は元の形式でデータを使用する場合は、コメントアウト第二と第四のオブジェクトで、X軸は1月から12月に至るまで...正しく注文されると、以下のように見える...

私は2番目と4番目のオブジェクトのコメントを解除し、同じコードを実行する場合は、あなたがYの大きさの値は、（それらが加算されて）正しいながら、月1月と4月は、X軸の最後に移動していることに気づくでしょう次のようになります。

私の質問：私はこれらの月のために複数のデータエントリを持っているときは、このエラーが発生する理由と1月と4月は、彼らが最初のチャート（1月、2月にあるのと同じ方法を命じているように、それを修正するための最良の方法は何か、 3月、4月、5月など）？

x.addOrderRule("Date"); 

が、X軸の値「1月」と「4月」はそれらに関連する2つの異なる日付を持っている：

Answer 1

理由は、あなたがこの順序付けルールが指定されていることです。

それは私たちが話しているだけヶ月ですので、その代わりに、あなたはハードヶ月に発注をコーディングすることができます：

x.addOrderRule(["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]); 

これはまた、すべての月があってもそこに軸に表示されることを確実にすることの利点を持っているでしょうその月のデータはありません。

警告：私はこれをテストし、あるいは以前にディンプルを使用しますが、そのdocumentationがこれを説明していません。