Question

我的图表看起来像这样：

Chart

我将测量轴用于Y：

y = myChart.addMeasureAxis("y", "rate");
y.tickFormat = ",.4f";

正如您所见，滴答从0.0000开始，而数据的值从3.0000以上开始。

例如，是否可以显示从2.5000开始的y刻度？

我试过了：

y.overrideMin = 2;

但它没有像我期望的那样起作用。 x轴消失：

chart 谢谢。

Answer 1

我担心覆盖最小轴值目前有点不理想。有一种解决方法，但它有点像黑客。基本上你只是完全隐藏x轴并绘制第二个图表，顶部没有系列，隐藏第二个图表的y轴。

所以在绘图之后：

c2 = new dimple.chart(svg, data);
c2.addCategoryAxis("x", "Day");
c2.addMeasureAxis("y", "Value").hidden = true;
c2.draw();

两个轴很好地相遇，看起来就像你想要的那样。

这是一个有效的例子：

http://jsfiddle.net/87GHM/2/

Answer 2

我也陷入了这个问题。无法找到y轴上“滴答”数量的减少程度。该库没有公开任何方法。所以，我修改了图书馆以满足我的需求。所以这是一个黑客^ _ ^

使用库的注释版本，即dimple.v1.1.4.js

找到第338行

if (!this.hidden) {
                switch (this.chart._axisIndex(this, "y")) {
                case 0:
                    this._draw = d3.svg.axis()
                        .orient("left")
                        .scale(this._scale)
                        .ticks(5);   <<<<<<<<<------ This wasn't there before
                    break;
                case 1:
                    this._draw = d3.svg.axis()
                        .orient("right")
                        .scale(this._scale);
                    break;
                default:
                    break;
                }
            }

添加刻度线（5）或您想要的任何数字。

Answer 3

只用CSS而没有JS可以达到相同的结果：

#your-graph .dimple-axis-x {
  g.tick text {
    opacity: 0;
  }

  g.tick:nth-child(10n) text {
    opacity: 1;
  }
}

测量轴 - 限制刻度值

3 个答案: