Click here to Skip to main content
11,485,294 members (77,757 online)
Click here to Skip to main content
Add your own
alternative version

JSON Data Visualizer (for Google, Yahoo!, Bing, and Twitter) using jQuery, JavaScript, ASP.NET MVC 2.0

, 29 Jun 2010 CPOL 44K 782 44
This article describes a JSON data visualizer for popular Web Services like Google, Yahoo!, Bing, and Twitter using jQuery, JavaScript, and ASP.NET MVC 2.0.
<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<dynamic>" %>



<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
	Bing, Yahoo or Google Web Service Json Data Visualizer
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
  
    <script type="text/javascript" src="/Scripts/jquery-1.4.2.js"></script>
    <script type="text/javascript" src="/Scripts/custom/beautify.js"></script>
    <script type="text/javascript" src="/Scripts/custom/prettyprint.js"></script>
    <script type="text/javascript" src="/Scripts/custom/beautifyresult1.js"></script>
    <script type="text/javascript" src="/Scripts/custom/paramselect1.js"></script>
    <script type="text/javascript" src="/Scripts/custom/BuildClassTree.js"></script>
<script type="text/javascript">
    //
    // var selecteditem;
    var searchengine = "Google";
    var urlengine = "http://ajax.googleapis.com/ajax/services/search/web?v=1.0"; ;
    var param1 = "&q=pizza 94539";
    $(document).ready(function () {
        Clear_AllData();
        Build_Engine();
        Build_Engine1();
    });
    //
    //Clear all data
    function Clear_AllData() {
        $('#headerdiv').empty();
        $('#rawdatadiv').empty();
        $('#tabledatadiv').empty();
        $('#JsonListdiv').empty();
        $('#beautifydiv').hide();
        $('#footerdiv').empty();
        $('#animclassdiv').empty();

    }

    //
    //toggle buttons
    function togglerawdata() {
        $("#rawdatadiv").toggle();
    };
    function toggletabledata() {
        $("#tabledatadiv").toggle();
    };





    function select_engine_select_onclick() {
        Build_Engine1();
    }

</script>
 <div id="controls_div" style="background-color: #FCFCFC">
        <select id="select_engine_select" 
            onclick="return select_engine_select_onclick()" 
            
            style="border: thin solid #000000; width: 108px; background-color: #FCFCFC;" >
      </select>
      <hr/><b>Parameters</b>
      <div id="buildenginediv"></div>
 <hr />
      <input type="button" class="cssbutton2" id="RawData_button" onclick="Get_Engine_Data('#rawdatadiv')" value="RawData"  />
       <input type="button" class="cssbutton2" id="table_Button" onclick="Get_Engine_Data('#tabledatadiv')" value="Table"  />
         <input type="button" class="cssbutton2" id="Beautify_button" onclick="Get_Engine_Data('#beautifydiv')" value="Beautify" />
        <input type="button" class="cssbutton2" id="Class_button" onclick="Get_Engine_Data('#JsonListdiv')" value="Class" />
      <input type="button" class="cssbutton2" id="Clear_button" onclick="Clear_AllData()" value="Clear Data" />
   
   
   <br />
    <hr />
        </div>
   <div id="headerdiv"></div>
   <div id="JsonListdiv"></div>
   <div id ="rawdatadiv"></div>
   <div id="tabledatadiv" ></div> 
   <div id="animclassdiv"></div> 
    <div id="beautifydiv">
  
  <textarea rows="30" cols="80" name="content" id="textdiv" 
            style="background-color: #FCFCFC">
  </textarea>
  </div>
   <div id="footerdiv"></div>
</asp:Content>

By viewing downloads associated with this article you agree to the Terms of Service and the article's licence.

If a file you wish to view isn't highlighted, and is a text file (not binary), please let us know and we'll add colourisation support for it.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Share

About the Author

silverazure
Architect
United States United States
Vijay Kumar: Architect, Programmer with expertise and interest in Azure, .net, Silverlight, C#, WCF, MVC, databases and mobile development. Concentrating on Windows Phone 7 and Windows Azure development. Lived in California for many years and done many exciting projects in dotnet and Windows platforms. Moved to Raleigh (RTP), North Carolina recently and available for consulting.  Blog http://Silverazure.blogspot.com.

| Advertise | Privacy | Terms of Use | Mobile
Web01 | 2.8.150520.1 | Last Updated 29 Jun 2010
Article Copyright 2010 by silverazure
Everything else Copyright © CodeProject, 1999-2015
Layout: fixed | fluid