Not Properly Updating With "Update" Buttons

      var data = [temperature,wind,precipitation,suitability,best_times];

      var updatemenus=[
      {
          buttons: [
              {
                  args: [{'visible': [true, true, true, true, false]},{'xaxis.visible': true, 'yaxis.visible': true, 'autosize': true}],
                  label: 'Chart',
                  method: 'update'
              },
              {
                  args: [{'visible': [false, false, false, false, true]},{'xaxis.visible': false, 'yaxis.visible': false, 'autosize': false, 'width': 500}],
                  label: 'Table',
                  method:'update'
              }
          ],

You can see the issue in this code pen:

Clicking “Table”, successfully hides the Chart elements and displays the table. But when I select “Chart” again, everything comes back except the table element remains. I just want the Table element to go back to being invisible. In order to do that, the user has to reload the page.

I’ve been struggling with this for you don’t want to know how long… I open to any ideas you might have.