Sposób oznaczania słupków Wykres słupkowy Google

Question

Używam Google Chart API do tworzenia wykresu dla wartości, które mają wartość od 1 do milionów.

Problem Słupki, które są reprezentujących mniejsze wartości (np mniej niż 50 lub więcej) są niewidoczne na wykresie i żaden sposób nie mogę zobaczyć, jakie wartości odpowiadają pewnej osi x.

Zostanie to rozwiązane, jeśli uda mi się jakoś wydrukować wartości osi Y na górze paska. Ale nie znalazłem w dokumencie API żadnej wzmianki o tym, jak to zrobić.

Jest podobny problem, ale nie odpowiada na moje pytanie.

put labels on top of inside bar in google interactive bar chart

Istnieje kilka innych ponad rok stare pytania bez odpowiedzi tutaj, mam nadzieję, że ktoś może się znaleźć rozwiązanie lub obejście teraz, dlatego tym pytaniem ponownie.

Google Visualization: Column Chart, simple question but can't find the answer

How to show values on the the top of columns Google Chart API

Czy możesz mi pokazać, jak osiągnąć to, co chcę używając How can I customize this Google Bar Chart??

Answer 1

Wyjazd Andrew Gallant za JSFiddle tutaj:

http://jsfiddle.net/asgallant/QjQNX/

wykorzystuje sprytny siekać wykresu kombi aby osiągnąć to, co myślę, że szukasz.

google.load("visualization", "1", {packages: ["corechart"]}); 
google.setOnLoadCallback(drawChart); 

function drawChart() { 
    var data = new google.visualization.DataTable(); 
    data.addColumn('string', 'Name'); 
    data.addColumn('number', 'Value'); 
    data.addColumn({type: 'string', role: 'annotation'}); 

    data.addRows([ 
    ['Foo', 53, 'Foo text'], 
    ['Bar', 71, 'Bar text'], 
    ['Baz', 36, 'Baz text'], 
    ['Cad', 42, 'Cad text'], 
    ['Qud', 87, 'Qud text'], 
    ['Pif', 64, 'Pif text'] 
    ]); 

    var view = new google.visualization.DataView(data); 
    view.setColumns([0, 1, 1, 2]); 

    var chart = new google.visualization.ComboChart(document.getElementById('chart_div')); 

    chart.draw(view, { 
    height: 400, 
    width: 600, 
    series: { 
     0: { 
     type: 'bars' 
     }, 
     1: { 
     type: 'line', 
     color: 'grey', 
     lineWidth: 0, 
     pointSize: 0, 
     visibleInLegend: false 
     } 
    }, 
    vAxis: { 
     maxValue: 100 
    } 
    }); 
} 

Answer 2

miałem pewne komplikacje przy użyciu adnotacji i niewidzialną linię (na przykład, posiadające on wyświetlany w dymku jak innej serii).

Zrobiłem hack do ComboChart (można pracować z BarChart i ColumnChart jak dobrze, z kilkoma zmianami), aby wstawić etykiety do formatu SVG.

Sprawdź to ryba: http://jsfiddle.net/augustomen/FE2nh/

Testowane na Firefox 21, Chrome i IE 27 9.