Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
<style>
    #chart_div {
        width: 50%;
        height: 100%;
    }   
</style>
    
<!--Load the AJAX API-->
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
    
google.load("visualization", "1", {packages:["corechart"]});
​
function drawVisualization() {
    // Create and populate the data table.
    var data = google.visualization.arrayToDataTable([
      ['Employee ID', 'Sales', 'Salary'],
      ['7000234', 560024, 9765],
      ['7000260', 1180800, 15621],
      ['7000262', 244308, 9212],
      ['7000273', 390912, 8650],
      ['7000288', 870445, 6692]
    ]);
​
    // Create and draw the visualization.
    var ac = new google.visualization.ComboChart(document.getElementById('chart_div'));
    ac.draw(data, {
        title : 'Sales and Salary',
        series: {
            0: { 
                type: "bars", 
                targetAxisIndex: 0
            },
            1: { 
                type: "line", 
                targetAxisIndex: 1
            }
        },
        width: 800,
        height: 400,
        hAxis: {
            title: "Employee ID"
        },
        vAxes: { 
            0: {
                title: "Sales"
            }, 
            1: {
                title:"Salary"
            }
        },
    });
}
​
​
google.setOnLoadCallback(drawVisualization);
</script>
</head>
​
<body>
    <!--Div that will hold the pie chart-->
    <div id="chart_div"></div>
</body>
</html>
 
​
 
​
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
antojurkovicpro
0viewers