Question

使用Sencha GXT 3.0可以生成折线图并使用动态数量的线序列字段填充它，如果是，推荐的方法是什么？

我知道可以将多个系列字段添加到图表中，但折线图示例（以及其他图表示例）使用扩展PropertyAccess<?>的接口，并且接口指定静态编号预期字段（例如data1（），data2（），data3（）等）。如果要使用该接口指定要添加到图表的字段，那么如何计算可能需要n个字段的图表（即给定图表上n个行系列）。

Sencha网站上提供的示例：

http://www.sencha.com/examples/#ExamplePlace:linechart

Answer 1

我遇到了同样的问题。如果每个系列都有一个商店而不是每个图表有一个商店，这将是一个更好的设计。

我在metricDataStore中有一长串指标值。每个度量标准值都有描述。我希望所有具有相同描述的度量值显示在一个（且仅一个）系列上。如果值不在系列中，我的每个系列的值都将为x和y轴返回null。

这对我来说似乎是一个黑客，但它适用于我的用法：

    myChart = new Chart<MetricData>();
    myChart.setStore(metricDataStore);

。。

    for (MetricInfo info : metricInfoData) {
        LineSeries<MetricData> series = new LineSeries<MetricData>();
        series.setChart(myChart);
        series.setSmooth(false);
        series.setShownInLegend(true);
        series.setHighlighting(true);
        series.setYAxisPosition(Chart.Position.LEFT);
        series.setYField(new MetricValueProvider(info.getName()));
        series.setXAxisPosition(Chart.Position.BOTTOM);
        series.setXField(new MetricTimeProvider(info.getName()));
        myChart.addSeries(series);
    }

。。

private class MetricTimeProvider extends Object implements ValueProvider<MetricData, Long> {
    private String metricName;

    public MetricTimeProvider(String metricName) {
        this.metricName = metricName;
    }

    @Override
    public Long getValue(MetricData m) {
        if (metricName != null && metricName.equals(m.getLongDesc()))
            return m.getId();
        else
            return null;
    }

    @Override
    public void setValue(MetricData m, Long value) {
    }

    @Override
    public String getPath() {
        return null;
    }
}

private class MetricValueProvider extends Object implements ValueProvider<MetricData, Double> {
    private String metricName;

    public MetricValueProvider(String metricName) {
        this.metricName = metricName;
    }

    @Override
    public Double getValue(MetricData m) {
        if (metricName != null && metricName.equals(m.getLongDesc()))
            return m.getMetricValue();
        else
            return null;
    }

    @Override
    public void setValue(MetricData m, Double value) {
    }

    @Override
    public String getPath() {
        return null;
    }
}

使用Sencha GXT 3，生成一个用动态数量的线序列字段填充的折线图？

1 个答案: