app.js
// Function to read in data from samples.JSON for bar chart
Function to read in data from samples.JSON for bar chart
Function to read in data from samples . JSON for bar chart
function updateBarPlot(samples) {
    d3.json('samples2.json').then(data => {
      let dataSamples = data.samples.filter(nameID => nameID.id === samples)[0];
      let trace1 = [{
        x: dataSamples.sample_values.slice(0,10).reverse(),
        y: dataSamples.otu_ids.slice(0,10).map(otuID => `OTU ${otuID}`).reverse(),
        type: "bar",
        orientation: "h",
        text: dataSamples.otu_labels,
        yaxis: {type: "category"}
        }];
      let layout1 = {
        title: "Top OTUs Found in an Individual",
      };
      Plotly.newPlot("bar", trace1, layout1);
    });
}
function updateBarPlot ( samples ) { d3 . json ( 'samples2.json' ) . then ( data => { let dataSamples = data . samples . filter ( nameID => nameID . id === samples ) [ 0 ] ; let trace1 = [ { x : dataSamples . sample_values . slice ( 0 , 10 ) . reverse ( ) , y : dataSamples . otu_ids . slice ( 0 , 10 ) . map ( otuID => ` ${ otuID } ` ) . reverse ( ) , type : "bar" , orientation : "h" , text : dataSamples . otu_labels , yaxis : { type : "category" } } ] ; let layout1 = { title : "Top OTUs Found in an Individual" , } ; Plotly . newPlot ( "bar" , trace1 , layout1 ) ; } ) ; }
Function to read in data from samples.JSON for bar chart
Function to read in data from samples . JSON for bar chart
// Use D3 library to read in samples.json // filtering data by the input value // Trace1 to plot bar graph // Use sample_values as the values for the bar chart // Use otu_ids as the labels for the bar chart. // Use otu_labels as the hovertext for the chart. // sorts graph to make it easier to read - Plotly documentation // Set layout with title // Build plot