Highchart（柱形图）：几乎没有数据标签出现在一个系列中 [英] Highchart (Column Chart) : Few data labels are not appearing for a series

问题描述

我使用高图创建柱形图 - 我无法显示图表中所有系列的所有数据标签。我在列表中有两个系列，第一个系列显示所有数据标签，第二个系列在显示其他数据标签时不显示少量数据标签。

提示帮助将非常感谢。

请参阅 Fiddle Sample

 chart：{
type：column，
plotShadow：false，
polar：false，
renderTo：
，
credits：{
enabled ：false 
}，
title：{
text：
}，
xAxis：{
categories： [类别1，类别2，类别3，类别4，类别5，类别6，类别7，类别8，类别9 b标签：{
enabled：true，
style：{
fontSize：8px，
fontFamily： Arial
} 
}，
lineWidth：1，
tickWidth：0，
title：{
text ：，
style：{
fontFamily：Arial
} 
} 
}，
yAxis：{
lineWidth：1，
title：{
text：，
style：{
fontFamily：Arial
 
 $ 
gridLineWidth：0，
labels：{
enabled：true，
format：{value ：
style：{
fontSize：8px，
fontFamily：Arial
} 
}，
startOnTick：true，
endOnTick：true 
}，
series：[{
name：Company Value，
data：[{
name：Adidas Group，
color：＃f1b11d，
y：63.0，
showInLegend：false，
dataLabels：{
align：center，
enabled 
borderColor：，
rotation：0，
style：{
fontSize：8px，
fontFamily： Arial
} 
}，
borderColor：#ffffff，
enableMouseTracking：false，
sliced：false，
selected：false 
}，{
name：Adidas Group，
color：＃f1b11d，
y：24.0，
showInLegend：false，
dataLabels：{
align：center，
enabled：true，
borderColor： ，
rotation：0，
style：{
fontSize： 8px，
fontFamily：Arial
} 
}，
borderColor：#ffffff，
enableMouseTracking：false，
sliced：false，
selected：false 
}，{
name：Adidas Group，
color：＃f1b11d， 
y：177.0，
showInLegend：false，
dataLabels：{
align：center，
enabled：true ，
borderColor：，
rotation：0，
style：{
fontSize：8px，
fontFamily ：Arial
} 
}，
borderColor：#ffffff，
enableMouseTracking：false，
sliced：false，
selected：false 
}，{
name：Adidas Group，
 color：＃f1b11d，
y：197.0，
showInLegend：false，
dataLabels：{
align：center， 
enabled：true，
borderColor：，
rotation：0，
style：{
fontSize：8px ，
fontFamily：Arial
} 
}，
borderColor：#ffffff，
enableMouseTracking：false，
sliced：false，
selected：false 
}，{
name：Adidas Group，
color：＃f1b11d，
y：224.0，
showInLegend：false，
dataLabels：{
align：center，
enabled 
borderColor：，
rotation：0，
style：{
 fontSize：8px，
fontFamily：Arial
} 
}，
borderColor：#ffffff，
enableMouseTracking ：false，
sliced：false，
selected：false 
}，{
name：Adidas Group，
color： ＃f1b11d，
y：297.0，
showInLegend：false，
dataLabels：{
align：center，
 enabled：true，
borderColor：，
rotation：0，
style：{
fontSize：8px，
fontFamily：Arial
} 
}，
borderColor：#ffffff，
enableMouseTracking：false，
sliced ：false，
selected：false 
}，{
n ame：adidas group，
color：＃f1b11d，
y：349.0，
showInLegend：false，
dataLabels：{ 
align：center，
enabled：true，
borderColor：，
rotation：0，
style ：{
fontSize：8px，
fontFamily：Arial
} 
}，
borderColor：#ffffff，
enableMouseTracking：false，
sliced：false，
selected：false 
}，{
name：Adidas Group，
color：＃f1b11d，
y：903.0，
showInLegend：false，
dataLabels：{
align：center ，
enabled：true，
borderColor：，
rotation：0，
 style：{
fontSize：8px，
fontFamily：Arial
} 
}，
borderColor：#ffffff ，
enableMouseTracking：false，
sliced：false，
selected：false 
}，{
name：Adidas Group ，
color：＃f1b11d，
y：20.0，
showInLegend：false，
dataLabels：{
align ：center，
enabled：true，
borderColor：，
rotation：0，
style：{
 fontSize：8px，
fontFamily：Arial
} 
}，
borderColor：#ffffff，
enableMouseTracking： false，
sliced：false，
selected：false 
 }]，
regression：false，
enableMouseTracking：true，
color：＃f1b11d，
showInLegend：false 
} ，{
name：所有公司平均分数，
data：[{
name：所有公司，
color： 00aeef，
y：25.0，
showInLegend：false，
dataLabels：{
align：center，
enabled ：true，
borderColor：，
rotation：0，
style：{
fontSize：8px，
 fontFamily：Arial
} 
}，
borderColor：#ffffff，
enableMouseTracking：false，
sliced：false ，
selected：false 
}，{
name：所有公司，
color：＃00aeef， 
y：18.0，
showInLegend：false，
dataLabels：{
align：center，
enabled：true ，
borderColor：，
rotation：0，
style：{
fontSize：8px，
fontFamily ：Arial
} 
}，
borderColor：#ffffff，
enableMouseTracking：false，
sliced：false，
selected：false 
}，{
name：所有公司，
color：＃00aeef，
y：90.0， 
showInLegend：false，
dataLabels：{
align：center，
enabled：true，
borderColor： ，
rotation：0，
style：{
fontSize： 8px，
fontFamily：Arial
} 
}，
borderColor：#ffffff，
enableMouseTracking：false，
sliced：false，
selected：false 
}，{
name：所有公司，
color：＃00aeef ，
y：1821.0，
showInLegend：false，
dataLabels：{
align：center，
enabled： 
borderSize：8px，
fontFamily ：Arial
} 
}，
borderColor：#ffffff，
enableMouseTracking：false，
sliced：false，
selected：false 
}，{
name：所有公司，
 color：＃00aeef，
y：84.0，
showInLegend：false，
dataLabels：{
align：center， 
enabled：true，
borderColor：，
rotation：0，
style：{
fontSize：8px ，
fontFamily：Arial
} 
}，
borderColor：#ffffff，
enableMouseTracking：false，
sliced：false，
selected：false 
}，{
name：所有公司，
color：＃00aeef，
y：83.0，
showInLegend：false，
dataLabels：{
align：center，
enabled 
borderColor：，
rotation：0，
style：{
fontSize：8px，
fontFamily：Arial
} 
}，
borderColor：#ffffff，
enableMouseTracking ：false，
sliced：false，
selected：false 
}，{
name：所有公司，
color ：＃00aeef，
y：97.0，
showInLegend：false，
dataLabels：{
align：center，
enabled：true，
borderColor：，
rotation：0，
style：{
fontSize：8px，
fontFamily：Arial
} 
}，
borderColor：#ffffff，
enableMouseTracking：false，
切片：false，
selected：false 
}，{
 name：所有公司，
color：＃00aeef，
y：241.0，
showInLegend：false，
dataLabels： {
align：center，
enabled：true，
borderColor：，
rotation：0，
style ：{
fontSize：8px，
fontFamily：Arial
} 
}，
borderColor：#ffffff， 
enableMouseTracking：false，
sliced：false，
selected：false 
}，{
name：All Companies，
color：＃00aeef，
y：12.0，
showInLegend：false，
dataLabels：{
align：中心，
enabled：true，
borderColor：，
rotation：0，
style：{
fontSize：8px，
fontFamily：Arial
} 
}，
borderColor： ffffff，
enableMouseTracking：false，
sliced：false，
selected：false 
}]，
regression：false，
enableMouseTracking：true，
color：＃00aeef，
showInLegend：false 
}]，
plotOptions：{
series：{
enableMouseTracking：false，
dataLabels：{
color：＃000000，
enabled：true，
borderColor：，
format：{y：.0f}
} 
}，
列：{
 pointWidth：20 
} 
}，
导出：{
enabled：false 
}，
tooltip：{
 enabled：true，
pointFormat：{series.name}：{point.y：.0f}，
shared：false，
headerFormat： 
，
legend：{
enabled：false，
x：0，
floating：false，
 shadow：false，
颠倒：false，
y：0 
} 
  

解决方案

设置 plotOptions.series.dataLabels.allowOverlap 选项为 true 。请参阅： http://jsfiddle.net/cthzmsg0/1

I am creating a column chart using High Charts -- I am not able to show all the data labels for all the series in the chart. I have two series in a column chart while the first series shows all the data labels the second series do not displays few of the data labels while displaying others.

Prompt help will highly be appreciated.

Please refer the Fiddle Sample to have hands on.

"chart": {
        "type": "column",
        "plotShadow": false,
        "polar": false,
        "renderTo": ""
    },
    "credits": {
        "enabled": false
    },
    "title": {
        "text": ""
    },
    "xAxis": {
        "categories": ["Category 1", "Category 2", "Category 3", "Category 4", "Category 5", "Category 6", "Category 7", "Category 8", "Category 9"],
        "labels": {
            "enabled": true,
            "style": {
                "fontSize": "8px",
                "fontFamily": "Arial"
            }
        },
        "lineWidth": 1,
        "tickWidth": 0,
        "title": {
            "text": "",
            "style": {
                "fontFamily": "Arial"
            }
        }
    },
    "yAxis": {
        "lineWidth": 1,
        "title": {
            "text": "",
            "style": {
                "fontFamily": "Arial"
            }
        },
        "gridLineWidth": 0,
        "labels": {
            "enabled": true,
            "format": "{value:.0f}",
            "style": {
                "fontSize": "8px",
                "fontFamily": "Arial"
            }
        },
        "startOnTick": true,
        "endOnTick": true
    },
    "series": [{
        "name": "Company Value",
        "data": [{
            "name": "Adidas Group",
            "color": "#f1b11d",
            "y": 63.0,
            "showInLegend": false,
            "dataLabels": {
                "align": "center",
                "enabled": true,
                "borderColor": "",
                "rotation": 0,
                "style": {
                    "fontSize": "8px",
                    "fontFamily": "Arial"
                }
            },
            "borderColor": "#ffffff",
            "enableMouseTracking": false,
            "sliced": false,
            "selected": false
        }, {
            "name": "Adidas Group",
            "color": "#f1b11d",
            "y": 24.0,
            "showInLegend": false,
            "dataLabels": {
                "align": "center",
                "enabled": true,
                "borderColor": "",
                "rotation": 0,
                "style": {
                    "fontSize": "8px",
                    "fontFamily": "Arial"
                }
            },
            "borderColor": "#ffffff",
            "enableMouseTracking": false,
            "sliced": false,
            "selected": false
        }, {
            "name": "Adidas Group",
            "color": "#f1b11d",
            "y": 177.0,
            "showInLegend": false,
            "dataLabels": {
                "align": "center",
                "enabled": true,
                "borderColor": "",
                "rotation": 0,
                "style": {
                    "fontSize": "8px",
                    "fontFamily": "Arial"
                }
            },
            "borderColor": "#ffffff",
            "enableMouseTracking": false,
            "sliced": false,
            "selected": false
        }, {
            "name": "Adidas Group",
            "color": "#f1b11d",
            "y": 197.0,
            "showInLegend": false,
            "dataLabels": {
                "align": "center",
                "enabled": true,
                "borderColor": "",
                "rotation": 0,
                "style": {
                    "fontSize": "8px",
                    "fontFamily": "Arial"
                }
            },
            "borderColor": "#ffffff",
            "enableMouseTracking": false,
            "sliced": false,
            "selected": false
        }, {
            "name": "Adidas Group",
            "color": "#f1b11d",
            "y": 224.0,
            "showInLegend": false,
            "dataLabels": {
                "align": "center",
                "enabled": true,
                "borderColor": "",
                "rotation": 0,
                "style": {
                    "fontSize": "8px",
                    "fontFamily": "Arial"
                }
            },
            "borderColor": "#ffffff",
            "enableMouseTracking": false,
            "sliced": false,
            "selected": false
        }, {
            "name": "Adidas Group",
            "color": "#f1b11d",
            "y": 297.0,
            "showInLegend": false,
            "dataLabels": {
                "align": "center",
                "enabled": true,
                "borderColor": "",
                "rotation": 0,
                "style": {
                    "fontSize": "8px",
                    "fontFamily": "Arial"
                }
            },
            "borderColor": "#ffffff",
            "enableMouseTracking": false,
            "sliced": false,
            "selected": false
        }, {
            "name": "Adidas Group",
            "color": "#f1b11d",
            "y": 349.0,
            "showInLegend": false,
            "dataLabels": {
                "align": "center",
                "enabled": true,
                "borderColor": "",
                "rotation": 0,
                "style": {
                    "fontSize": "8px",
                    "fontFamily": "Arial"
                }
            },
            "borderColor": "#ffffff",
            "enableMouseTracking": false,
            "sliced": false,
            "selected": false
        }, {
            "name": "Adidas Group",
            "color": "#f1b11d",
            "y": 903.0,
            "showInLegend": false,
            "dataLabels": {
                "align": "center",
                "enabled": true,
                "borderColor": "",
                "rotation": 0,
                "style": {
                    "fontSize": "8px",
                    "fontFamily": "Arial"
                }
            },
            "borderColor": "#ffffff",
            "enableMouseTracking": false,
            "sliced": false,
            "selected": false
        }, {
            "name": "Adidas Group",
            "color": "#f1b11d",
            "y": 20.0,
            "showInLegend": false,
            "dataLabels": {
                "align": "center",
                "enabled": true,
                "borderColor": "",
                "rotation": 0,
                "style": {
                    "fontSize": "8px",
                    "fontFamily": "Arial"
                }
            },
            "borderColor": "#ffffff",
            "enableMouseTracking": false,
            "sliced": false,
            "selected": false
        }],
        "regression": false,
        "enableMouseTracking": true,
        "color": "#f1b11d",
        "showInLegend": false
    }, {
        "name": "All Companies Average Score",
        "data": [{
            "name": "All Companies",
            "color": "#00aeef",
            "y": 25.0,
            "showInLegend": false,
            "dataLabels": {
                "align": "center",
                "enabled": true,
                "borderColor": "",
                "rotation": 0,
                "style": {
                    "fontSize": "8px",
                    "fontFamily": "Arial"
                }
            },
            "borderColor": "#ffffff",
            "enableMouseTracking": false,
            "sliced": false,
            "selected": false
        }, {
            "name": "All Companies",
            "color": "#00aeef",
            "y": 18.0,
            "showInLegend": false,
            "dataLabels": {
                "align": "center",
                "enabled": true,
                "borderColor": "",
                "rotation": 0,
                "style": {
                    "fontSize": "8px",
                    "fontFamily": "Arial"
                }
            },
            "borderColor": "#ffffff",
            "enableMouseTracking": false,
            "sliced": false,
            "selected": false
        }, {
            "name": "All Companies",
            "color": "#00aeef",
            "y": 90.0,
            "showInLegend": false,
            "dataLabels": {
                "align": "center",
                "enabled": true,
                "borderColor": "",
                "rotation": 0,
                "style": {
                    "fontSize": "8px",
                    "fontFamily": "Arial"
                }
            },
            "borderColor": "#ffffff",
            "enableMouseTracking": false,
            "sliced": false,
            "selected": false
        }, {
            "name": "All Companies",
            "color": "#00aeef",
            "y": 1821.0,
            "showInLegend": false,
            "dataLabels": {
                "align": "center",
                "enabled": true,
                "borderColor": "",
                "rotation": 0,
                "style": {
                    "fontSize": "8px",
                    "fontFamily": "Arial"
                }
            },
            "borderColor": "#ffffff",
            "enableMouseTracking": false,
            "sliced": false,
            "selected": false
        }, {
            "name": "All Companies",
            "color": "#00aeef",
            "y": 84.0,
            "showInLegend": false,
            "dataLabels": {
                "align": "center",
                "enabled": true,
                "borderColor": "",
                "rotation": 0,
                "style": {
                    "fontSize": "8px",
                    "fontFamily": "Arial"
                }
            },
            "borderColor": "#ffffff",
            "enableMouseTracking": false,
            "sliced": false,
            "selected": false
        }, {
            "name": "All Companies",
            "color": "#00aeef",
            "y": 83.0,
            "showInLegend": false,
            "dataLabels": {
                "align": "center",
                "enabled": true,
                "borderColor": "",
                "rotation": 0,
                "style": {
                    "fontSize": "8px",
                    "fontFamily": "Arial"
                }
            },
            "borderColor": "#ffffff",
            "enableMouseTracking": false,
            "sliced": false,
            "selected": false
        }, {
            "name": "All Companies",
            "color": "#00aeef",
            "y": 97.0,
            "showInLegend": false,
            "dataLabels": {
                "align": "center",
                "enabled": true,
                "borderColor": "",
                "rotation": 0,
                "style": {
                    "fontSize": "8px",
                    "fontFamily": "Arial"
                }
            },
            "borderColor": "#ffffff",
            "enableMouseTracking": false,
            "sliced": false,
            "selected": false
        }, {
            "name": "All Companies",
            "color": "#00aeef",
            "y": 241.0,
            "showInLegend": false,
            "dataLabels": {
                "align": "center",
                "enabled": true,
                "borderColor": "",
                "rotation": 0,
                "style": {
                    "fontSize": "8px",
                    "fontFamily": "Arial"
                }
            },
            "borderColor": "#ffffff",
            "enableMouseTracking": false,
            "sliced": false,
            "selected": false
        }, {
            "name": "All Companies",
            "color": "#00aeef",
            "y": 12.0,
            "showInLegend": false,
            "dataLabels": {
                "align": "center",
                "enabled": true,
                "borderColor": "",
                "rotation": 0,
                "style": {
                    "fontSize": "8px",
                    "fontFamily": "Arial"
                }
            },
            "borderColor": "#ffffff",
            "enableMouseTracking": false,
            "sliced": false,
            "selected": false
        }],
        "regression": false,
        "enableMouseTracking": true,
        "color": "#00aeef",
        "showInLegend": false
    }],
    "plotOptions": {
        "series": {
            "enableMouseTracking": false,
            "dataLabels": {
                "color": "#000000",
                "enabled": true,
                "borderColor": "",
                "format": "{y:.0f}"
            }
        },
        "column": {
            "pointWidth": 20
        }
    },
    "exporting": {
        "enabled": false
    },
    "tooltip": {
        "enabled": true,
        "pointFormat": "{series.name}: {point.y:.0f}",
        "shared": false,
        "headerFormat": ""
    },
    "legend": {
        "enabled": false,
        "x": 0,
        "floating": false,
        "shadow": false,
        "reversed": false,
        "y": 0
    }

解决方案

Set plotOptions.series.dataLabels.allowOverlap option to true. See : http://jsfiddle.net/cthzmsg0/1

这篇关于Highchart（柱形图）：几乎没有数据标签出现在一个系列中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！