Javascript ExtJS5聚类图

是否有人试图在ExtJS5中实现集群图表

我在ExtJS中看到了这个例子

但在这方面没有任何例子

我试图从遗留厨房水槽复制示例，但无法在本地服务器上运行。我能得到的一切都显示在附带的屏幕截图上：

---

可能是Ext JS版本的问题？我使用的是5.0.0.970，目前看来它是最新版本。

请将xtype:“图表”更改为xtype:“笛卡尔”

他们删除了图表组件，添加了笛卡尔、极坐标和空间填充组件

参考：

我找到了解决方案。

---

在当前版本中，“sencha图表”似乎没有群集图表功能。如果您需要，您可以使用“外部图表”。将其添加到app.json的“requires”部分。然后来自的示例将起作用。

我通过使用

stacked:false

实现了这一点

代码示例

图表：

Ext.define('App.Domain.Chart', {
    extend: 'Ext.chart.CartesianChart',
    title: 'Chart',
    alias: 'widget.appDomainChart',
    legend: {
        docked: 'bottom'
    },
    interactions: ['itemhighlight'],
    colors: ['blue', 'red'],
    axes: [{
        type: 'numeric',
        position: 'left',
        adjustByMajorUnit: true,
        grid: true,
        fields: ['ActualParameter'],
        minimum: 0
    }, {
        type: 'category',
        position: 'bottom',
        grid: true,
        fields: ['ControlValue'],
    }],
    series: [{
        type: 'bar',
        axis: 'left',
        title: ['Fact', 'Planned'],
        xField: 'ControlValue',
        yField: ['ActualParameter', 'PlannedParameter'],
        display: 'outside',
        stacked: false,
        style: {
            opacity: 0.80
        },
        highlight: {
            fillStyle: 'green'
        },
        tooltip: {
            style: 'background: #fff',
            renderer: function (storeItem, item) {
                var browser = item.series.getTitle()[Ext.Array.indexOf(item.series.getYField(), item.field)];
                this.setHtml(browser + ': ' + storeItem.get(item.field) + '.');
            }
        }
    }]
});

数据：

---

结果如图所示：

您是否尝试使用笛卡尔坐标实现聚类图？不适合我，你这个男人。。。堆叠的财产是我一直在寻找的。谢谢

{
  "data": {
    "items": [
      {
        "Id": 54,
        "ObjectName": null,
        "StageName": null,
        "Result": "Result 1",
        "ControlValue": "Control value 1",
        "PlannedParameter": 10.0,
        "ActualParameter": 10.0,
        "Unit": "days",
        "Indicator": 1
      },
      {
        "Id": 55,
        "ObjectName": null,
        "StageName": null,
        "Result": "",
        "ControlValue": "Control value 2",
        "PlannedParameter": 3.0,
        "ActualParameter": 3.0,
        "Unit": "departments",
        "Indicator": 1
      },
      {
        "Id": 56,
        "ObjectName": null,
        "StageName": null,
        "Result": "",
        "ControlValue": "Control value 3",
        "PlannedParameter": 100.0,
        "ActualParameter": 100.0,
        "Unit": "%",
        "Indicator": 4
      }
    ],
    "totalCount": 3
  },
  "errors": [],
  "success": true,
  "totalCount": 3,
  "globalErrors": []
}