Input

Bars (1)

Number:

Bars (2)

Number: Color:

Bars (3)

Number: Color: Height:

Viz

$('button#show').click(function(){    
    var value = $('input#show').val()    
    console.log(value)
    $('.myviz').html(value)
})

$('button#setcolor').click(function(){    
    // TODO: set the background color of the viz window to the specified color
    $('.myviz').css('background-color','TODO')
})

// TODO: add an event handler for "Set Height" button to set the height of the
// viz window to the specified value

// TODO: add an event handler for "Show Bars (1)" to display a specified number of
// vertical bars
$('button#bars1').click(function(){    
    var svg = "<svg><rect height='50' width='10'/><rect height='50' width='10' x='20'/></svg>"
    $('.myviz').html(svg)    
})

// TODO: add an event handler for "Show Bars (2)" to display a specified number of
// vertical bars in the specified color

// TODO: add an event handler for "Show Bars (3)" to display a specified number of
// vertical bars in the specified color at the specified height