title: graphql query to json query
body: <p>Given this GraphQL <a href="https://api.entur.org/doc/shamash-journeyplanner/?query=%7B%0A%20%20trip(%0A%20%20%20%20from%3A%20%7Bplace%3A%20%22NSR%3AStopPlace%3A5533%22%20%7D%2C%0A%20%20%20%20to%3A%20%7Bplace%3A%22NSR%3AStopPlace%3A5532%22%7D%0A%20%20)%20%0A%20%20%20%20%7B%0A%20%20%20%20tripPatterns%7Bduration%7D%0A%20%20%7D%20%0A%7D" rel="nofollow noreferrer">example</a>, how can I in Javascript do a similar request with JSON?</p>
  
  <p>Using GraphQL the query in the example is:</p>
  
  <pre><code>{
    trip(
      from: {place: "NSR:StopPlace:5533" },
      to: {place:"NSR:StopPlace:5532"}
    ) 
      {
      tripPatterns{duration}
    } 
  }
  </code></pre>
  
  <p>According to the documentation the URL to query is <a href="https://api.entur.io/journey-planner/v2/graphql" rel="nofollow noreferrer">https://api.entur.io/journey-planner/v2/graphql</a> .</p>
  
  <p>Here is what I tried in Javascript:</p>
  
  <pre><code>var url = "https://api.entur.io/journey-planner/v2/graphql";
  
  var tripquery = 
  {
      trip: 
      {
          __args: {
              from : {place :"NSR:StopPlace:5533" },
              to : {place :"NSR:StopPlace:5532" }                     
          },
          tripPatterns: {
              duration : true             
          }
      }
  };
  
  function jsonQuery(){
  
      var qry = JSON.stringify(tripquery);
      var url_qry = url + "?query=" + qry;
  
      var xhttp = new XMLHttpRequest();
      xhttp.open("POST", url_qry, true);
      xhttp.setRequestHeader("Content-Type", "application/json");
  
      xhttp.onreadystatechange = function(){
          console.log("onreadystatechange");
          if(xhttp.readyState === 4 &amp;&amp; xhttp.status === 200){
              console.log("json-query-OK");
              console.log(xhttp.responseText);
          }
          else{
              console.log("xhttp.status      : " + xhttp.status);
              console.log("xhttp.statusText  : " + xhttp.statusText);
              console.log("xhttp.readyState  : " + xhttp.readyState);
              console.log("xhttp.responseType: " + xhttp.responseType);
              console.log("xhttp.responseText: " + xhttp.responseText);
              console.log("xhttp.responseURL : " + xhttp.responseURL);
              console.log("json-not-ok");
          }
      };
  
  
  
      xhttp.send();
      console.log("query sent");
  }
  </code></pre>
  
  <p>The code above will result in this output in the console:</p>
  
  <pre><code>query sent
  api.entur.io/journey-planner/v2/graphql?query={%22trip%22:{%22__args%22:{%22from%22:{%22place%22:%22NSR:StopPlace:5533%22},%22to%22:{%22place%22:%22NSR:StopPlace:5532%22}},%22tripPatterns%22:{%22duration%22:true}}}:1 POST https://api.entur.io/journey-planner/v2/graphql?query={%22trip%22:{%22__args%22:{%22from%22:{%22place%22:%22NSR:StopPlace:5533%22},%22to%22:{%22place%22:%22NSR:StopPlace:5532%22}},%22tripPatterns%22:{%22duration%22:true}}} 400 (Bad Request)
  query.js:29 onreadystatechange
  query.js:35 xhttp.status      : 400
  query.js:36 xhttp.statusText  : Bad Request
  query.js:37 xhttp.readyState  : 2
  query.js:38 xhttp.responseType: 
  query.js:39 xhttp.responseText: 
  query.js:40 xhttp.responseURL : https://api.entur.io/journey-planner/v2/graphql?query={%22trip%22:{%22__args%22:{%22from%22:{%22place%22:%22NSR:StopPlace:5533%22},%22to%22:{%22place%22:%22NSR:StopPlace:5532%22}},%22tripPatterns%22:{%22duration%22:true}}}
  query.js:41 json-not-ok
  query.js:29 onreadystatechange
  query.js:35 xhttp.status      : 400
  query.js:36 xhttp.statusText  : Bad Request
  query.js:37 xhttp.readyState  : 3
  query.js:38 xhttp.responseType: 
  query.js:39 xhttp.responseText: No query found in body
  query.js:40 xhttp.responseURL : https://api.entur.io/journey-planner/v2/graphql?query={%22trip%22:{%22__args%22:{%22from%22:{%22place%22:%22NSR:StopPlace:5533%22},%22to%22:{%22place%22:%22NSR:StopPlace:5532%22}},%22tripPatterns%22:{%22duration%22:true}}}
  query.js:41 json-not-ok
  query.js:29 onreadystatechange
  query.js:35 xhttp.status      : 400
  query.js:36 xhttp.statusText  : Bad Request
  query.js:37 xhttp.readyState  : 4
  query.js:38 xhttp.responseType: 
  query.js:39 xhttp.responseText: No query found in body
  query.js:40 xhttp.responseURL : https://api.entur.io/journey-planner/v2/graphql?query={%22trip%22:{%22__args%22:{%22from%22:{%22place%22:%22NSR:StopPlace:5533%22},%22to%22:{%22place%22:%22NSR:StopPlace:5532%22}},%22tripPatterns%22:{%22duration%22:true}}}
  query.js:41 json-not-ok
  </code></pre>
  
  <p>The <code>__args</code> in the Json object is something I got from an example online, but I haven't really understood it.</p>
  
  <p>Maybe I'm not sure what exactly to search for, but I can't find some good explanation of how to translate this GraphQL query to a JSON object.</p>