我有一个有四个象限的页面。每个象限都有一个浮点图表，表示已保存报告中的数据。单击图表会将用户带到仪表板区域，在该区域中可以看到更大版本的flot图表，表格数据和UI控件以更改设置。所有这些都奏效了。
上周我升级到0.8.3。突然，带有象限的页面中的图表都缺少其刻度标签。其他一切工作正常：图表正确地绘制了数据图表，当您点击图表查看仪表板中的报告时，较大的flot图表工作正常，包括刻度标签。
在两个图表中，图表数据完全相同：
[
{
"color":"#1592ab",
"groupData":[
{
"type":"product",
"label":"8M MAX",
"splitTypeLegend":"Product"
}
],
"splitGroups":[
{
"splitType":"product",
"splitIdentifier":"677",
"splitLabel":"8M MAX"
}
],
"label":"8M MAX (1 units)",
"hoverable":true,
"data":[
[
1401494400000,
34.932668,
"1",
"2",
"",
""
],
[
1401580800000,
37.06447464,
"1",
"6",
"",
""
],
[
1401667200000,
37.21810664,
"1",
"6",
"",
""
],
[
1401753600000,
32.85324,
"1",
"1",
"",
""
]
]
},
{
"color":"#871010",
"groupData":[
{
"type":"product",
"label":"8M WBC",
"splitTypeLegend":"Product"
}
],
"splitGroups":[
{
"splitType":"product",
"splitIdentifier":"676",
"splitLabel":"8M WBC"
}
],
"label":"8M WBC (1 units)",
"hoverable":true,
"data":[
[
1401408000000,
35.485664,
"1",
"1",
"",
""
],
[
1401494400000,
34.92812,
"1",
"2",
"",
""
],
[
1401580800000,
37.436968,
"1",
"1",
"",
""
]
]
},
{
"color":"#21632f",
"groupData":[
{
"type":"product",
"label":"24M WBC",
"splitTypeLegend":"Product"
}
],
"splitGroups":[
{
"splitType":"product",
"splitIdentifier":"675",
"splitLabel":"24M WBC"
}
],
"label":"24M WBC (1 units)",
"hoverable":true,
"data":[
[
1401408000000,
36.67866,
"1",
"2",
"",
""
],
[
1401494400000,
33.975452,
"1",
"2",
"",
""
],
[
1401580800000,
36.545028,
"1",
"2",
"",
""
],
[
1401667200000,
37.554504,
"1",
"1",
"",
""
]
]
},
{
"color":"#cf8c19",
"groupData":[
{
"type":"product",
"label":"80M 20M FTTCWBC",
"splitTypeLegend":"Product"
}
],
"splitGroups":[
{
"splitType":"product",
"splitIdentifier":"678",
"splitLabel":"80M 20M FTTCWBC"
}
],
"label":"80M 20M FTTCWBC (1 units)",
"hoverable":true,
"data":[
[
1401408000000,
36.147816,
"1",
"1",
"",
""
],
[
1401494400000,
35.66955064,
"1",
"12",
"",
""
],
[
1401580800000,
37.06554,
"1",
"6",
"",
""
],
[
1401667200000,
36.92269864,
"1",
"6",
"",
""
],
[
1401753600000,
34.992038,
"1",
"4",
"",
""
]
]
},
{
"color":"#634b4b",
"groupData":[
{
"type":"product",
"label":"--Unassigned--",
"splitTypeLegend":"Product"
}
],
"splitGroups":[
{
"splitType":"product",
"splitIdentifier":"0",
"splitLabel":"--Unassigned--"
}
],
"label":"--Unassigned-- (1 units)",
"hoverable":true,
"data":[
[
1401580800000,
37.508096,
"1",
"1",
"",
""
],
[
1401753600000,
33.2178,
"1",
"1",
"",
""
]
]
}
]
选项非常相似，唯一的区别是在象限视图中关闭了与flot图表的交互。
以下是象限视图的图表选项：
{
"grid":{
"margin":{
"top":10,
"bottom":10,
"right":0,
"left":25
},
"markings":false
},
"legend":{
"labelBoxBorderColor":"#666666",
"noColumns":3,
"show":true,
"container":"#report0legend"
},
"series":{
"bars":{
"show":false
},
"lines":{
"show":true
},
"points":{
"radius":1.5,
"show":true
},
"shadowSize":0
},
"xaxis":{
"axisLabelFontFamily":"Arial",
"axisLabelFontSizePixels":12,
"dayNames":[
"Sunday",
"Monday",
"Tuesday",
"Wednesday",
"Thursday",
"Friday",
"Saturday"
],
"font":{
"size":12,
"family":"Arial",
"color":"#333"
},
"monthNames":[
"Jan",
"Feb",
"Mar",
"Apr",
"May",
"Jun",
"Jul",
"Aug",
"Sept",
"Oct",
"Nov",
"Dec"
],
"timezone":"utc",
"axisLabel":null,
"labelAngle":-45,
"mode":"time",
"tickFormatter":null,
"tickSize":null,
"minTickSize":[
1,
"day"
],
"timeformat":"%d %b %Y"
},
"yaxis":{
"axisLabelFontFamily":"Arial",
"axisLabelFontSizePixels":12,
"font":{
"size":12,
"family":"Arial",
"color":"#333"
},
"autoscaleMargin":0.01,
"axisLabel":"HTTP MT Downstream (Mbps)",
"min":0,
"tickFormatter":null
},
"metricName":"HTTP MT Downstream",
"metricUnit":"Mbps",
"mode":"time"
}
对于仪表板视图：
{
"crosshair":{
"color":"#1592ab",
"mode":null
},
"grid":{
"hoverable":true,
"margin":{
"top":20,
"left":40,
"bottom":20,
"right":20
},
"markings":false,
"clickable":true,
"mouseActiveRadius":10
},
"legend":{
"noColumns":3,
"show":true,
"container":"#graph-legend",
"labelBoxBorderColor":"#666666"
},
"selection":{
"mode":"xy"
},
"series":{
"bars":{
"show":false
},
"lines":{
"show":true
},
"points":{
"show":true
},
"shadowSize":0
},
"xaxis":{
"axisLabelFontFamily":"Arial",
"axisLabelFontSizePixels":12,
"dayNames":[
"Sun",
"Mon",
"Tue",
"Wed",
"Thu",
"Fri",
"Sat"
],
"font":{
"size":12,
"family":"Arial",
"color":"#333"
},
"monthNames":[
"Jan",
"Feb",
"Mar",
"Apr",
"May",
"Jun",
"Jul",
"Aug",
"Sept",
"Oct",
"Nov",
"Dec"
],
"timezone":"utc",
"axisLabel":"Day",
"labelAngle":-45,
"mode":"time",
"tickFormatter":null,
"tickSize":null,
"minTickSize":[
1,
"day"
],
"timeformat":"%d %b %Y"
},
"yaxis":{
"axisLabelFontFamily":"Arial",
"axisLabelFontSizePixels":12,
"font":{
"size":12,
"family":"Arial",
"color":"#333"
},
"axisLabel":"HTTP MT Downstream (Mbps)",
"autoscaleMargin":0.01,
"min":0,
"tickFormatter":null,
"ticks":20
},
"metricName":"HTTP MT Downstream",
"metricUnit":"Mbps",
"mode":"time"
}
我在jquery.flot.js的第2184行在console.log(axis)内添加了drawAxisLabels()，所有标签都正确添加到刻度数组中。它们根本就没有在图表上呈现。
有什么想法？ （如果您需要更多代码，请询问。我相信我已经包含了相关位，但如果需要更多，我可以提供它。）
答案 0 :(得分：4)
在你的小提琴的第72行附近你有这条线：
graphCanvas.removeClass('nodata').children('div').empty().remove();
这对应于抓取占位符div中的第一个div并清空它。您正在清空的div包含轴标签。
这一行是fiddle commenting。