【发布时间】:2015-09-01 20:09:36
【问题描述】:
我在我的应用程序中使用了角度融合图表指令。我从其中一个示例中创建了热图图表。我被困在我的应用程序中,x 轴的值没有显示。我找不到这有什么问题。
var salesHMChart = new FusionCharts({
type: 'heatmap',
renderAt: 'chart-container',
width: '550',
height: '470',
dataFormat: 'json',
dataSource: {
"chart": {
"caption": "Downtime Reasons",
"bgColor": "ffffff",
"outCnvBaseFontSize": "10",
"outCnvBaseFontColor": "000000",
"canvasBgColor": "ffffff",
"toolTipColor": "ffffff",
"showXaxisLabels": "1",
"toolTipBorderThickness": "0",
"toolTipBgColor": "#000000",
"toolTipBgAlpha": "80",
"toolTipBorderRadius": "2",
"toolTipPadding": "5",
"hdivLineColor": "e8700e",
"vdivLineColor": "e8700e",
"showborder": "0",
"showPlotBorder": "1",
"plotBorderColor": "e8700e",
"canvasBorderColor": "e8700e"
},
"columns": {
"column": [
{
"id": "1123741",
"label": "order 1123741"
},
{
"id": "858546",
"label": "order 858546"
}
]
},
"dataset": [
{
"data": [
{
"rowid": "Limpieza Input",
"columnid": "1123741",
"value": "1",
"tllabel": "Limpieza Input",
"trlabel": "Order #1123741"
},
{
"rowid": "Marcha Input",
"columnid": "858546",
"value": "27",
"tllabel": "Marcha Input",
"trlabel": "Order #858546"
},
{
"rowid": "Averia KKE Input",
"columnid": "858546",
"value": "2",
"tllabel": "Averia KKE Input",
"trlabel": "Order #858546"
},
{
"rowid": "Documentacion Input",
"columnid": "858546",
"value": "1",
"tllabel": "Documentacion Input",
"trlabel": "Order #858546"
},
{
"rowid": "Cambio (Set-Up) Input",
"columnid": "858546",
"value": "7",
"tllabel": "Cambio (Set-Up) Input",
"trlabel": "Order #858546"
},
{
"rowid": "Limpieza Input",
"columnid": "858546",
"value": "5",
"tllabel": "Limpieza Input",
"trlabel": "Order #858546"
},
{
"rowid": "Mantenimiento planificado Input",
"columnid": "858546",
"value": "1",
"tllabel": "Mantenimiento planificado Input",
"trlabel": "Order #858546"
},
{
"rowid": "No laborable Input",
"columnid": "858546",
"value": "5",
"tllabel": "No laborable Input",
"trlabel": "Order #858546"
},
{
"rowid": "Sin trabajo Input",
"columnid": "858546",
"value": "14",
"tllabel": "Sin trabajo Input",
"trlabel": "Order #858546"
},
{
"rowid": "ST Maq. parada",
"columnid": "858546",
"value": "1",
"tllabel": "ST Maq. parada",
"trlabel": "Order #858546"
}
]
}
],
"colorrange": {
"gradient": "1",
"minvalue": "1",
"code": "fce797",
"startlabel": "Low",
"endlabel": "High",
"color": [
{
"maxvalue": "4",
"code": "f74c25",
"label": "Medium"
},
{
"code": "c71610",
"maxvalue": "7"
}
]
}
}
})
.render();
});
这里是演示Fiddle
任何帮助将不胜感激。
编辑
在将列 ID 1123741 更改为 112741 并删除整个列对象后,我感到很惊讶。它正在工作。由于我显然无法更改数据,我想找出它为什么不起作用! :(
【问题讨论】:
-
非常有趣的问题。好吧,当您没有明确定义行和列对象时,Heatmap 会尝试从数据中获取它(自动)。在这里,您定义了行部分而不是列,它可能会混淆。但是完全删除列部分应该可以使其正常工作。令人惊讶的是,我还没有弄清楚为什么这个问题与那个特定的号码有关。如果您将第一个对象一个接一个地放置,问题也会消失。似乎是个问题。
-
@pallabB 是的,这似乎是个问题。我也在融合图表论坛上发帖。他们说 columnid 中的位数应该相同,但不应该像预期的那样,因此他们将此问题传递给了开发团队。让我们看看他们现在说了什么。
标签: javascript angularjs fusioncharts