Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums JavaScript AnythingSlider Issue with Multiple Google Visualization API charts

  • This topic is empty.
Viewing 1 post (of 1 total)
  • Author
    Posts
  • #30611
    stuttsdc
    Member

    I’ve had no problem putting all sorts of content into AnythingSlider. This includes use of Google Maps, Google StreetView, and various charts from the Google Visualization API. However, when I try to put two of these charts into my slider, only the first one shows up. When I remove that div from the AS’s li and put it outside of the ASlider, it shows up. So that tells me the issue is with the slider.

    Here’s an example of my script that creates the two charts:

    google.load('visualization', '1', {'packages':});

    // Set a callback to run when the API is loaded.
    google.setOnLoadCallback(drawExistMap);
    google.setOnLoadCallback(drawTrussChart);

    // Callback that creates and populates a data table
    function drawExistMap() {
    var data = new google.visualization.DataTable();

    //do a bunch of stuff here to populate the table and create the chart

    //Create the table visualization object and call the draw method on it.
    var container = document.getElementById('existMap');
    var geomap = new google.visualization.GeoMap(container);
    geomap.draw(data, options);

    }

    //drawTrussChart creates pie chart showing truss types of returned bridges
    function drawTrussChart() {
    //similar to the above stuff ......
    var chart = new google.visualization.PieChart(document.getElementById('TTChart_div'));
    chart.draw(data, options);
    }

    My two div tags (existMap and TTChart_div) are both in separate li tags inside the slider.
    Only the first chart shows up. but if I take the second one (TTChart_div) out of the slider and put it elsewhere, it displays fine.

    UPDATE: I’ve experimented w/this a bit and thrown as many as 3 charts into the slider. It’s ONLY when a chart div is in the LAST tab (li tag) that it doesn’t display. So, let’s say I have 5 tabs/slides and I place the 3 charts in the middle three tabs, they all display! But if one of those charts is in the last tab, it doesn’t show up. Unfortunately, my needs are that this stupid thing is in the last slide so now I’m not sure what I can do.

Viewing 1 post (of 1 total)
  • The forum ‘JavaScript’ is closed to new topics and replies.