You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

MPAndroidChart HorizontalBarChart自定义:标签、网格与配色调整

HorizontalBarChart 自定义标签、网格线与颜色配置方案

针对你用MPAndroidChart的HorizontalBarChart遇到的三个需求,直接给你对应的实现方案:

1. 为每个条形添加标签

这里分两种标签,分别对应分类名称和条形数值:

  • Y轴分类标签:显示每个条形的名称(如EXTRAVERSION、Friendliness)
    给左侧Y轴设置自定义ValueFormatter,把Y轴的索引映射到你的标签列表:
    val yAxis = extrachart.axisLeft
    yAxis.valueFormatter = object : ValueFormatter() {
        override fun getFormattedValue(value: Float): String {
            return labelsExtroversion.getOrNull(value.toInt()) ?: ""
        }
    }
    // 隐藏右侧无用的Y轴
    extrachart.axisRight.isEnabled = false
    
  • 条形数值标签:显示每个条形对应的数值
    在BarDataSet上开启数值显示,并设置样式:
    barDataSetExtroversion.setDrawValues(true) // 开启数值标签
    barDataSetExtroversion.setValueTextSize(12f) // 设置文本大小
    barDataSetExtroversion.setValueTextColor(Color.WHITE) // 夜间模式用浅色
    

2. 移除所有网格线

需要分别关闭X轴、Y轴的网格线,同时关闭图表的网格背景:

// 关闭X轴网格线
val xAxis = extrachart.xAxis
xAxis.setDrawGridLines(false)

// 关闭Y轴网格线
val yAxis = extrachart.axisLeft
yAxis.setDrawGridLines(false)

// 关闭图表的网格背景层
extrachart.setDrawGridBackground(false)

3. 适配夜间模式的颜色配置

统一设置所有线条、文本颜色,确保夜间模式下清晰可见:

// X轴样式配置
val xAxis = extrachart.xAxis
xAxis.textColor = Color.WHITE // X轴标签颜色
xAxis.axisLineColor = Color.WHITE // X轴轴线颜色

// Y轴样式配置
val yAxis = extrachart.axisLeft
yAxis.textColor = Color.WHITE // Y轴标签颜色
yAxis.axisLineColor = Color.WHITE // Y轴轴线颜色

// 图例颜色配置
extrachart.legend.textColor = Color.WHITE

// 条形数值文本颜色(和之前的设置保持一致)
barDataSetExtroversion.setValueTextColor(Color.WHITE)

// 可选:设置图表背景色为深色
extrachart.setBackgroundColor(Color.BLACK)

完整修改后的Kotlin代码

extrachart = findViewById(R.id.extraversionchart)
val dataEntriesExtroversion = mutableListOf<BarEntry>()
val labelsExtroversion = mutableListOf<String>()
var personalityResultsExtroversion = mutableMapOf<String, Int>()

personalityoutputmap.get("EXTRAVERSION")?.let { personalityResultsExtroversion.put("EXTRAVERSION", it) }
personalityoutputmap.get("Friendliness")?.let { personalityResultsExtroversion.put("Friendliness", it) }
personalityoutputmap.get("Gregariousness")?.let { personalityResultsExtroversion.put("Gregariousness", it) }
personalityoutputmap.get("Assertiveness")?.let { personalityResultsExtroversion.put("Assertiveness", it) }
personalityoutputmap.get("Activity Level")?.let { personalityResultsExtroversion.put("Activity Level", it) }
personalityoutputmap.get("Excitement-Seeking")?.let { personalityResultsExtroversion.put("Excitement-Seeking", it) }
personalityoutputmap.get("Cheerfulness")?.let { personalityResultsExtroversion.put("Cheerfulness", it) }

for ((label, value) in personalityResultsExtroversion) {
    dataEntriesExtroversion.add(BarEntry(dataEntriesExtroversion.size.toFloat(), value.toFloat()))
    labelsExtroversion.add(label)
}

dataEntriesExtroversion.reverse()
labelsExtroversion.reverse()

val barDataSetExtroversion = BarDataSet(dataEntriesExtroversion, "Extraversion Traits")
barDataSetExtroversion.setColors(color)
// 开启条形数值标签
barDataSetExtroversion.setDrawValues(true)
barDataSetExtroversion.setValueTextColor(Color.WHITE)
barDataSetExtroversion.setValueTextSize(12f)

val barDataExtroversion = BarData(barDataSetExtroversion)
extrachart.data = barDataExtroversion

// 配置Y轴分类标签
val yAxis = extrachart.axisLeft
yAxis.valueFormatter = object : ValueFormatter() {
    override fun getFormattedValue(value: Float): String {
        return labelsExtroversion.getOrNull(value.toInt()) ?: ""
    }
}
yAxis.setDrawGridLines(false)
yAxis.textColor = Color.WHITE
yAxis.axisLineColor = Color.WHITE
extrachart.axisRight.isEnabled = false

// 配置X轴
val xAxis = extrachart.xAxis
xAxis.setDrawGridLines(false)
xAxis.textColor = Color.WHITE
xAxis.axisLineColor = Color.WHITE

// 移除网格背景
extrachart.setDrawGridBackground(false)
// 设置图例颜色
extrachart.legend.textColor = Color.WHITE
// 夜间模式背景色
extrachart.setBackgroundColor(Color.BLACK)

extrachart.invalidate()

内容的提问来源于stack exchange,提问作者Rudranil Bhattacharjee

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.06.18 13:57:36