减少dimple.js图表​​和轴之间的填充

Question

我正在创建7个或更少积分的图表。我的页面还允许在图表类型之间切换 除了面积图在图表的两侧和轴之间有相当大的空白区域外，所有图表都很好。它看起来并不好看，特别是与其他图表不同。我希望图表占据整个图表区域。我注意到当有很多点时，轴旋转90°，图表占据整个空间。

如何指定此行为？我已经弄乱了边缘/边界，但它很脆弱。

http://jsbin.com/rihoredoja/1/edit

Answer 1

这是因为你在x上使用了一个类别轴，它以规则的间隔排列每个点。您的图表更适合时间轴：

var svg = dimple.newSvg("#chartContainer", 600, 400),
    data = [
      { "year": "1998", "val": 123456789 },
      { "year": "1999", "val": 234567890 },
      { "year": "2000", "val": 234567890 },
      { "year": "2001", "val": 123456789 },
      { "year": "2002", "val": 134567890 },
      { "year": "2003", "val": 123456789 },
      { "year": "2004", "val": 234567890 }
    ],
    c = new dimple.chart(svg, data),
    x = c.addTimeAxis("x", "year", "%Y", "%Y"),
    y = c.addMeasureAxis("y", "val"),
    s = c.addSeries(null, dimple.plot.area);

c.draw();