动态数据显示图表：更改Y轴范围

Question

有没有办法从D3更改线图的Y轴限制？

我正在使用Codeplex源的最新版本... WPF版本，而不是Silverlight版本。

我正在绘制来自Android传感器的读数，范围值会发生很大变化。有时它大约为零，图表看起来像这样：

然后值的大小发生变化，Y轴被重新缩放以显示整个数据，现在图表看起来像这样：

从图片1到2可以看到Y值发生了很大变化。

我想要的是使Y轴具有我选择的固定值，比如-10到+10。然后图表将始终以相同的比例绘制。

有没有办法做到这一点？

图表的XAML代码如下：

    <d3:ChartPlotter
        Name="gyroGraph"
        Margin="21,5,10,0"
        Grid.ColumnSpan="2"
        Background="White"
        Grid.Row="1"
        LegendVisibility="Collapsed"
        NewLegendVisible="False"
        MainHorizontalAxisVisibility="Collapsed"
        MainVerticalAxisVisibility="Collapsed">
        <d3:VerticalAxis
            FontSize="8" />
        <d3:Header
            Content="Angular Velocity"
            FontSize="11" />
    </d3:ChartPlotter>

感谢您的来信，最好的问候， Rodrigo Basniak

- rbasniak

---

如果值超出了初始设置范围（-10到10），您希望采取什么行为？轴是否应保持固定（并裁剪图形），还是应重新调整轴以适合所有点？ - Ricibob

我不在意值是否超出初始范围。无论如何，我需要定义的范围保持不变。这些值不应超出定义的范围，但如果确实超出了，如果图表裁剪它们，那也没关系。 - rbasniak

Answer 1

希望不算太晚，但我遇到了同样的问题，并在d3的论坛上找到了解决方案：http://dynamicdatadisplay.codeplex.com/discussions/281164 这段代码是由d3用户'fromDKwithlove'创建的。

以下是如何应用限制条件：

ViewportAxesRangeRestriction restr = new ViewportAxesRangeRestriction();
restr.YRange = new DisplayRange(-5, 105);
plotter.Viewport.Restrictions.Add(restr);

以下是与该代码相关的类：

public class DisplayRange
{
    public double Start { get; set; }
    public double End { get; set; }

    public DisplayRange(double start, double end)
    {
        Start = start;
        End = end;
    }
}

public class ViewportAxesRangeRestriction : IViewportRestriction
{
    public DisplayRange XRange = null;
    public DisplayRange YRange = null;

    public Rect Apply(Rect oldVisible, Rect newVisible, Viewport2D viewport)
    {
        if (XRange != null)
        {
            newVisible.X = XRange.Start;
            newVisible.Width = XRange.End - XRange.Start;
        }

        if (YRange != null)
        {
            newVisible.Y = YRange.Start;
            newVisible.Height = YRange.End - YRange.Start;
        }

        return newVisible;
    }

    public event EventHandler Changed;
}

- Moobie

---

你有没有想过如何使用这段代码来设置DateTime轴的范围？ - virious

Answer 2

我不确定您想要的确切行为是什么 - 如果需要，您可以澄清一下。
使用FitToView时，我需要一个固定的初始轴，其特定值为图形超出初始轴后，轴会从那时起自动调整大小。
为了实现这一点，我使用了一个带有DomainRestriction的FitToViewRestriction：

<d3:ChartPlotter.FitToViewRestrictions>
    <d3:DomainRestriction Domain="0,0,10,14000"/>
</d3:ChartPlotter.FitToViewRestrictions>

在这里，Domain rect是确定初始轴限的初始视口矩形。设置FitToView意味着当图形超出此初始限制时，轴将发生缩放。

但需要注意的是，在我们使用的D3版本（0.3.4703.0）中，DomainRestriction.Apply的实现并没有给我想要的行为，因此有必要修改源代码。相关文件为DynamicDataDisplay\v0.3.4703 - Nightly src\src\DynamicDataDisplay\ViewportRestrictions\DomainRestrictions.cs。
我对DomainRestriction.Apply进行了修改：

public override DataRect Apply(DataRect oldDataRect, DataRect newDataRect, Viewport2D viewport) {
    return (domain.IsEmpty) ? newDataRect : DataRect.Union(newDataRect, domain);
}

这会产生我所描述的行为。我认为您想要类似的东西，但仅适用于x轴。也就是说，您希望y保持在其初始值，但随着数据的输入，x会随之缩放，并使用FitToView。只需修改上述方法，您就可以获得该行为。

- Ricibob

---

你好，你的代码给了我一个思路。我看到D3 dll上有很多限制对象，但我不知道如何应用它们。我尝试过，但没有太大的成功。我编辑了我的帖子以更好地澄清我的需求。 - rbasniak

Answer 3

如果您想对DateTime执行相同的操作，只需简单地更改DisplayRange对象的创建方式即可：

ViewportAxesRangeRestriction r = new ViewportAxesRangeRestriction
{
  YRange = new DisplayRange(vm.MinTemp, vm.MaxTemp),
  XRange = new DisplayRange(DateTimeAxis.ConvertToDouble(vm.StartTime), DateTimeAxis.ConvertToDouble(vm.EndDate))
};

- Tomasz