简体   繁体   中英

Google Column Chart Missing data

i have been googling a lot of time, but did not find any working solution, so decided to ask a question. Why i can't see my firs data_row element 99.00 date?

heres the code how i init all script:

var colors = [ '#F1A504', '#80CE61', '#0BA3E4', '#7E4CCF' ];
var gChart = {
    table_data : {
        1: 'Reguliavimas "į viršų" kiekis',
        2: 'Reguliavimas "žemyn" kiekis',
        3: 'Reguliavimas "į viršų" kaina',
        4: 'Reguliavimas "žemyn" kaina'
    },
    data_row : [
        [ new Date( 2013, 3, 17, 0, 00, 00 ), 0.00, 99.00, 0.00, 40.00],
        [new Date( 2013, 3, 17, 1, 00, 00 ), 0.00, 11.00, 0.00, 40.00],
        [new Date( 2013, 3, 17, 2, 00, 00 ), 0.00, 0.00, 0.00, 0.00],
        [new Date( 2013, 3, 17, 3, 00, 00 ), 0.00, 27.00, 0.00, 38.00],
        [new Date( 2013, 3, 17, 4, 00, 00 ), 0.00, 0.00, 0.00, 0.00],
        [new Date( 2013, 3, 17, 5, 00, 00 ), 0.00, 0.00, 0.00, 0.00],
        [new Date( 2013, 3, 17, 6, 00, 00 ), 0.00, 0.00, 0.00, 0.00],
        [new Date( 2013, 3, 17, 7, 00, 00 ), 0.00, 0.00, 0.00, 0.00],
        [new Date( 2013, 3, 17, 8, 00, 00 ), 0.00, 42.00, 0.00, 38.00],
        [new Date( 2013, 3, 17, 9, 00, 00 ), 0.00, 30.00, 0.00, 38.00],
        [new Date( 2013, 3, 17, 10, 00, 00 ), 0.00, 20.00, 0.00, 38.00],
        [new Date( 2013, 3, 17, 11, 00, 00 ), 0.00, 0.00, 0.00, 0.00],
        [new Date( 2013, 3, 17, 12, 00, 00 ), 0.00, 0.00, 0.00, 0.00],
        [new Date( 2013, 3, 17, 13, 00, 00 ), 0.00, 0.00, 0.00, 0.00],
        [new Date( 2013, 3, 17, 14, 00, 00 ), 0.00, 0.00, 0.00, 0.00],
        [new Date( 2013, 3, 17, 15, 00, 00 ), 0.00, 0.00, 0.00, 0.00],
        [new Date( 2013, 3, 17, 16, 00, 00 ), 0.00, 46.00, 0.00, 38.00],
        [new Date( 2013, 3, 17, 17, 00, 00 ), 0.00, 90.00, 0.00, 38.00],
        [new Date( 2013, 3, 17, 18, 00, 00 ), 0.00, 90.00, 0.00, 38.00],
        [new Date( 2013, 3, 17, 19, 00, 00 ), 0.00, 108.00, 0.00, 38.00],
        [new Date( 2013, 3, 17, 20, 00, 00 ), 0.00, 75.00, 0.00, 38.00],
        [new Date( 2013, 3, 17, 21, 00, 00 ), 0.00, 0.00, 0.00, 0.00],
        [new Date( 2013, 3, 17, 22, 00, 00 ), 0.00, 0.00, 0.00, 0.00],
        [new Date( 2013, 3, 17, 23, 00, 00 ), 0.00, 0.00, 0.00, 0.00 ]
    ],
    lang : 'lt',
    maxV : 108.00,
    minV : 0.00,
    chartType: 1,
    dataGroup: 'H'
};


function drawChart( id, table_data, data_row, lang, chartType, colors ){

var dataTable = new google.visualization.DataTable();

dataTable.addColumn('datetime', 'Time');
for ( var i = 1; i <= objCount( table_data ); i++ ) {

    dataTable.addColumn( 'number', table_data[i] );
}

var dataView = new google.visualization.DataView( dataTable );


var options3 = {
    width: 670,
    height: 380,
    fontSize: 11,
    colors: colors,
    backgroundColor: 'transparent',
    legend: 'none',
    chartArea: {
        top: 5,
        left: 50,
        width: 647,
        height: 351
    },
    hAxis: {
        textStyle: { color: "#9a9fa3" },
        baselineColor: "#b1b3b6",
        gridlines: {
            color: "transparent",
            count: 28
        },
        maxAlternation: 26,
        format: gChart.dataGroup
    },
    vAxis: {
        baselineColor: "#b1b3b6",
        gridlines: {
            color: "#eff0f1",
            count: 8
        },
        textStyle: { color: "#9a9fa3" }
    }
};


var chart = new google.visualization.ColumnChart( document.getElementById( id ) );
dataTable.addRows( data_row );
chart.draw( dataView, options3 );

}

/* LOADING GCHARTS */
google.load( "visualization", "1", { packages:["corechart"], language: gChart.lang } );
google.setOnLoadCallback(function() {
    drawChart( 'chart', gChart.table_data, gChart.data_row, gChart.lang, gChart.chartType, colors );
});

Please see my answer at Google Visualization Chart Not Showing First Column

Essentially, you need your DataView to format the first column of the table as a string.

After:

var dataView = new google.visualization.DataView( dataTable );

Insert:

dataView.setColumns([{calc: function(data, row) { return data.getFormattedValue(row, 0); }, type:'string'}, 1, 2, 3, 4]);

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM