title: How to Embed Google Trends into React app
body: <p>I'm attempting to embed Google Trends into React so I can adjust the parameters dynamically. I can successfully embed it directly into the index.html file.</p>
  
  <pre><code>   &lt;script
        type="text/javascript"
        src="https://ssl.gstatic.com/trends_nrtr/1644_RC01/embed_loader.js"
      &gt;&lt;/script&gt;
      &lt;script type="text/javascript"&gt;
        trends.embed.renderExploreWidget(
          "TIMESERIES",
          {
            comparisonItem: [{ keyword: "/m/030q7", geo: "", time: "now 7-d" }],
            category: 0,
            property: ""
          },
          {
            exploreQuery: "q=%2Fm%2F030q7&amp;date=now%207-d",
            guestPath: "https://trends.google.com:443/trends/embed/"
          }
        );
      &lt;/script&gt;
  </code></pre>
  
  <p>However, I need to be able to change it via user input, so it needs to be in my jsx file. I've found a useful Helmet component to assist in adding scripts</p>
  
  <pre><code>  &lt;Helmet&gt;
      &lt;script
        type="text/javascript"
        src="https://ssl.gstatic.com/trends_nrtr/1644_RC01/embed_loader.js"
      /&gt;
      &lt;script type="text/javascript"&gt;
        {trends.embed.renderExploreWidget(
          "TIMESERIES",
          {
            comparisonItem: [
              { keyword: "/m/030q7", geo: "", time: "now 7-d" }
            ],
            category: 0,
            property: ""
          },
          {
            exploreQuery: "q=%2Fm%2F030q7&amp;date=now%207-d",
            guestPath: "https://trends.google.com:443/trends/embed/"
          }
        )}
      &lt;/script&gt;
    &lt;/Helmet&gt;
  </code></pre>
  
  <p>but I'm getting such as</p>
  
  <blockquote>
    <p>'trends' is not defined  no-undef</p>
  </blockquote>
  
  <p>I've tried adding 'this' and 'window' but get different errors.</p>
  
  <p>Can anyone assist in helping me fix this?</p>
  
  <p>EDIT</p>
  
  <p>Although the proposed solution didn't work for me directly, I did manage to get it working properly by taking the generated iframe tag and implement this instead.</p>
  
  <pre><code>          &lt;iframe
              id="trends-widget-2"
              src="https://trends.google.com:443/trends/embed/explore/TIMESERIES?req=%7B%22comparisonItem%22%3A%5B%7B%22keyword%22%3A%22bitcoin%22%2C%22geo%22%3A%22US%22%2C%22time%22%3A%22today%2012-m%22%7D%5D%2C%22category%22%3A0%2C%22property%22%3A%22%22%7D&amp;amp;tz=-480&amp;amp;eq=q%3Dbrexit%26geo%3DUS%26date%3Dtoday%2012-m"
              width="100%"
              height="300px"
              frameborder="0"
              scrolling="0"
            /&gt;
  </code></pre>