Highcharts legend底部居中显示并设置上下间距

highcharts yekong

Highcharts legend底部居中显示并设置上下间距

在Highcharts中,你可以通过设置legend属性来改变图例的位置和样式。以下是如何将图例放在底部居中并设置上下间距的示例:

legend: {
  align: 'center',  // 图例居中显示
  verticalAlign: 'bottom',  // 图例在底部显示
  itemMarginTop: 10,  // 图例项上间距
  itemMarginBottom: 10,  // 图例项下间距
  symbolHeight: 12,
  symbolWidth: 12,
  symbolRadius: 0,  // 设置为0使图标变为方块
  itemStyle: {
    'font-size': '14px',
    'font-family': 'MiSans',
    'font-weight': '400',
    color: '#FFFFFF',
    opacity: 0.6
  }
}

在上述代码中,alignverticalAlign属性用于设置图例的位置,itemMarginTopitemMarginBottom属性用于设置图例项的上下间距。

喜欢