score:0

I found the solution to my problem. I used the same variable name for the on change event for both charts that were on the same page. I simply needed to use a different name. I needed to make the following updates to my code. Note that I simply changed the variable name for "select" on one chart to "select2" on the other.

    // I used this for one chart...
    var select = d3
      .select("#weatherStation")
      .style("border-radius", "5px")
      .on("change", function () {
       chartTrend.update1(this.value, 750);
      });

    var checkbox = d3
      .select("#sortPRCP")
      .style("margin-left", "1%")
      .on("click", function () {
       chartTrend.update1(select.property("value"), 750);
      });

    // I updated the variable name for the second...
    var select2 = d3
      .select("#weatherStation")
      .style("border-radius", "5px")
      .on("change", function () {
       chartTrend.update1(this.value, 750);
      });

    var checkbox = d3
      .select("#sortPRCP")
      .style("margin-left", "1%")
      .on("click", function () {
       chartTrend.update1(select2.property("value"), 750);
      });

Related Query