Loading ...
Sorry, an error occurred while loading the content.

Can't get external/remote data into chart

Expand Messages
  • amcwhu
    Hi I am trying to display a bar chart with data from an external server on our intranet. I have got the remote cgi to generate the following:- { Results : [
    Message 1 of 2 , Aug 3, 2009
    • 0 Attachment
      Hi

      I am trying to display a bar chart with data from an external server on our intranet. I have got the remote cgi to generate the following:-

      {"Results":
      [
      {"Name":"USAX310P","Value":"0.00"},
      {"Name":"IPGDA050","Value":"2.00"},
      {"Name":"ODOFO035","Value":"35.33"},
      {"Name":"IEPUA005","Value":"0.00"},
      {"Name":"ODOFO034","Value":"23.33"},
      {"Name":"ODOFO036","Value":"23.33"}
      ]}

      and have pretty much cloned the sample code to produce the code shown below (The verbose sample works fine). The chart gets displayed, but without any data, so i am guessing that i have done something wrong in the java script below. I think i have to use the XHRdatasource, and have tried, but i am not sure how to do so. Can anyone help me out please?

      <link rel="stylesheet" type="text/css" href="/yui/build/fonts/fonts-min.css" />
      <script type="text/javascript" src="/yui/build/yahoo-dom-event/yahoo-dom-event.js"></script>
      <script type="text/javascript" src="/yui/build/json/json-min.js"></script>

      <script type="text/javascript" src="/yui/build/element/element-min.js"></script>
      <script type="text/javascript" src="/yui/build/connection/connection-min.js"></script>
      <script type="text/javascript" src="/yui/build/datasource/datasource-min.js"></script>
      <script type="text/javascript" src="/yui/build/charts/charts-min.js"></script>

      <style type="text/css">
      #chart
      {
      width: 900px;
      height: 600px;
      }

      .chart_title
      {
      display: block;
      font-size: 1.2em;
      font-weight: bold;
      margin-bottom: 0.4em;
      }
      </style>


      <div class="yui-skin-sam">

      <h1>Chart with DataSource Polling</h1>

      <div class="exampleIntro">
      <p>... text deleted.... .</p>

      </div>


      <span class="chart_title"></span>
      <div id="chart">... test deleted ..... </div>

      <script type="text/javascript">

      YAHOO.widget.Chart.SWFURL = "/yui/build/charts/assets/charts.swf";

      //--- data

      var jsonData = new YAHOO.util.DataSource("http://userid:pwd@gvmp/andy/cgi/a8sdsfda?");
      //use POST so that IE doesn't cache the data
      jsonData.connMethodPost = true;
      jsonData.responseType = YAHOO.util.RDataSource.TYPE_JSON;
      jsonData.connXhrMode = "queueRequests";
      jsonData.responseSchema =
      {
      resultsList: "Results",
      fields: ["Name","Value"]
      //fields: ["Value","Name"]
      };

      //jsonData.sendrequest();

      //--- chart



      var yAxis = new YAHOO.widget.CategoryAxis();

      var xAxis = new YAHOO.widget.NumericAxis();
      xAxis.minimum = 0;
      xAxis.maximum = 100;

      var mychart = new YAHOO.widget.BarChart( "chart", jsonData,
      {
      yField: "Name",
      xField: "Value",
      xAxis: xAxis,
      yAxis: yAxis,
      polling: 10000,
      // style: styleDef,
      //only needed for flash player express install
      expressInstall: "/yui/examples/charts/assets/expressinstall.swf"

      //jsonData.sendrequest();

      });
      </script>
    • Dwight Bridges
      Looks like your problem may be a typo. Changing: jsonData.responseType = YAHOO.util.RDataSource.TYPE_JSON; to: jsonData.responseType =
      Message 2 of 2 , Aug 6, 2009
      • 0 Attachment
        Re: [ydn-javascript] Can't get external/remote data into chart Looks like your problem may be a typo.
        Changing:
        jsonData.responseType = YAHOO.util.RDataSource.TYPE_JSON;

        to:
        jsonData.responseType = YAHOO.util.DataSource.TYPE_JSON;

        should fix it.

        Tripp


        On 8/3/09 10:19 AM, "amcwhu" <andycorpes@...> wrote:


         
         

        Hi

        I am trying to display a bar chart with data from an external server on our intranet. I have got the remote cgi to generate the following:-

        {"Results":
        [
        {"Name":"USAX310P","Value":"0.00"},
        {"Name":"IPGDA050","Value":"2.00"},
        {"Name":"ODOFO035","Value":"35.33"},
        {"Name":"IEPUA005","Value":"0.00"},
        {"Name":"ODOFO034","Value":"23.33"},
        {"Name":"ODOFO036","Value":"23.33"}
        ]}

        and have pretty much cloned the sample code to produce the code shown below (The verbose sample works fine).  The chart gets displayed, but without any data, so i am guessing that i have done something wrong in the java script below.  I think i have to use the XHRdatasource, and have tried, but i am not sure how to do so. Can anyone help me out please?  

        <link rel="stylesheet" type="text/css" href="/yui/build/fonts/fonts-min.css" />
        <script type="text/javascript" src="/yui/build/yahoo-dom-event/yahoo-dom-event.js"></script>
        <script type="text/javascript" src="/yui/build/json/json-min.js"></script>

        <script type="text/javascript" src="/yui/build/element/element-min.js"></script>
        <script type="text/javascript" src="/yui/build/connection/connection-min.js"></script>
        <script type="text/javascript" src="/yui/build/datasource/datasource-min.js"></script>
        <script type="text/javascript" src="/yui/build/charts/charts-min.js"></script>

        <style type="text/css">
        #chart
        {
        width: 900px;
        height: 600px;
        }

        .chart_title
        {
        display: block;
        font-size: 1.2em;
        font-weight: bold;
        margin-bottom: 0.4em;
        }
        </style>

        <div class="yui-skin-sam">

        <h1>Chart with DataSource Polling</h1>

        <div class="exampleIntro">
        <p>...  text deleted.... .</p>

        </div>

        <span class="chart_title"></span>
        <div id="chart">...  test deleted ..... </div>

        <script type="text/javascript">

        YAHOO.widget.Chart.SWFURL = "/yui/build/charts/assets/charts.swf";

        //--- data

        var jsonData = new YAHOO.util.DataSource("http://userid:pwd@gvmp/andy/cgi/a8sdsfda?");
        //use POST so that IE doesn't cache the data
        jsonData.connMethodPost = true;
        jsonData.responseType = YAHOO.util.RDataSource.TYPE_JSON;
        jsonData.connXhrMode = "queueRequests";
        jsonData.responseSchema =
        {
        resultsList: "Results",
        fields: ["Name","Value"]
        //fields: ["Value","Name"]
        };

        //jsonData.sendrequest();

        //--- chart

        var yAxis = new YAHOO.widget.CategoryAxis();

        var xAxis = new YAHOO.widget.NumericAxis();
        xAxis.minimum = 0;
        xAxis.maximum = 100;

        var mychart = new YAHOO.widget.BarChart( "chart", jsonData,
        {
        yField: "Name",
        xField: "Value",
        xAxis: xAxis,
        yAxis: yAxis,
        polling: 10000,
        // style: styleDef,
        //only needed for flash player express install
        expressInstall: "/yui/examples/charts/assets/expressinstall.swf"

        //jsonData.sendrequest();

        });
        </script>

          
            


      Your message has been successfully submitted and would be delivered to recipients shortly.