title: dimple.js - sort x-axis data numerical not alphabetical
body: <p>I have chart data for my x-axis that starts with 0 and goes up to 1200, by 100 increments.  When it displays on the chart in ascending order 0 is last, not first.  If I put leading zeros on the data then 0 is in the right spot, this makes me think that the data is being sorted alphabetically rather than numerically.  </p>
  
  <p>Is there a way to sort numerically? </p>
  
  <p>Here is my chart:</p>
  
  <p>edit--> I guess I need a better StackOverflow reputation to post an image, so you'll just have to imagine a bar chart with data on the x-axis that goes from 100 to 1200 then show the data for 0 after 1200.</p>
  
  <p>Here is the code for the chart:</p>
  
  <pre><code>var svg = dimple.newSvg("#idle-times-chart-container", 1000, 500);
      var chart = new dimple.chart(svg, data);
      var x = chart.addCategoryAxis("x", "xAxis");
      x.addOrderRule("xAxis", false);
      var y = chart.addMeasureAxis("y", "yAxis");
      y.tickFormat = "%";
      chart.addSeries(["OpCode"], dimple.plot.bar);
      var myLegend = chart.addLegend(950, 50, 60, 100, "Right");
      chart.draw();
      x.titleShape.text("Idle Times");
      chart.legends = [];
      var filterValues = dimple.getUniqueValues(data, "OpCode");
      myLegend.shapes.selectAll("rect")
          .on("click", function (e) {
              var hide = false;
              var newFilters = [];
              filterValues.forEach(function (f) {
                  if (f === e.aggField.slice(-1)[0]) {
                      hide = true;
                  } else {
                      newFilters.push(f);
                  }
              });
              if (hide) {
                  d3.select(this).style("opacity", 0.2);
              } else {
                  newFilters.push(e.aggField.slice(-1)[0]);
                  d3.select(this).style("opacity", 0.8);
              }
              filterValues = newFilters;
              chart.data = dimple.filterData(data, "OpCode", filterValues);
              chart.draw(1000);
              x.titleShape.text("Idle Times");
          });
  </code></pre>