删除Highcharts图表上条形下的类别文本

时间:2012-05-18 11:51:17

标签: c# javascript css charts highcharts

我的图表看起来像这样:

我想删除条形下的文字,“ödmjukhet”,“engagemang”等。但是当用户将鼠标悬停在条形图上时,我仍然希望在标签上显示类别名称。我怎么能这样做?

这是我在C#中的代码

        Highcharts chart1 = new Highcharts("Chart")
        .SetXAxis(new XAxis { Categories = averageGrades.Select(averageGrade => averageGrade.CoreValue.Name).ToArray(), })
        .SetYAxis(new YAxis { Min = 0, Max = 10, TickInterval = 1, Title = new YAxisTitle { Text = "Betygskalan" } })
        .SetSeries(new Series { Data = data, Name = "Snittbetyg" })
        .SetLegend(new Legend { Enabled = false, Layout = Layouts.Horizontal})
        .SetTitle(new Title { Text = "" })
        .InitChart(new Chart { DefaultSeriesType = ChartTypes.Column, Height = 300, Width = 200});

这是javascript输出代码的代码:

var Chart;
$(document).ready(function() {
    Chart = new Highcharts.Chart({
        chart: { renderTo:'Chart_container', defaultSeriesType: 'column', height: 300, width: 200 }, 
        legend: { enabled: false, layout: 'horizontal' }, 
        title: { text: '' }, 
        xAxis: { categories: ['Engagemang', 'Kompetens', 'Lönsamhet', 'Ödmjukhet'] }, 
        yAxis: { max: 10, min: 0, tickInterval: 1, title: { text: 'Betygskalan' } }, 
        series: [{ data: [{ color: '#FF9980', y: 4 }, { color: '#A6FF80', y: 8 }, { color: '#FF9980', y: 3 }, { color: '#A6FF80', y: 9 }], name: 'Snittbetyg' }]
    });
});

提前致谢!

2 个答案:

答案 0 :(得分:3)

删除

 xAxis: { categories: ['Engagemang', 'Kompetens', 'Lönsamhet', 'Ödmjukhet'] }, 

来自您的代码

OR  如果您想继续悬停,请在您的样式中添加类,请参阅DEMO

.highcharts-axis{
    display: none;
}​

答案 1 :(得分:0)

执行此操作的最佳方法可能是在xaxis中内置标签对象。

http://www.highcharts.com/ref/#xAxis-labels--enabled

以下应该可以做到这一点,而不是像Rab的回答那样依赖于覆盖他们的风格。这显然是首选,因为API比HTML格式更加固定。

xAxis: { 
    categories: ['Engagemang', 'Kompetens', 'Lönsamhet', 'Ödmjukhet'],
    labels: {enabled: false}
},