oh, i forgot to mention that the other chart's code is nearly identical save for a different div name and a different type of chart.
On Jul 7, 10:22 am, Marlow <marlowena...@gmail.com> wrote: > sure: > > <script type="text/javascript" src="https://www.google.com/jsapi";></ > script> > <script type="text/javascript" src="/sites/BRAC/Chart/Scripts/ > jquery-1.4.2.min.js"></script> > <script type="text/javascript" src="/sites/BRAC/Chart/Scripts/ > jPoint-0.8.min.js"></script> > <script type="text/javascript"> > /*//////////////////////////// > //Reference Libraries and Scripts loaded... > /////////////////////////////////////////////////////////////////////////// > ///////////////////////////// > // > > // > //Author: Marlow > // > //Date of Version 1.0: July, 2nd 2010 > > // > //Date of Current Version: July, 7th 2010 > // > //Description: The following code retrieves data from a sharepoint > list to populate // > // a google.visualization.DataTable to be displayed on a > AnnotatedTimeline. // > //Anyone is free to use this code as they see fit, but please credit > where credit is due. // > //In order for this code to work for custom variants, certain > variables might // > // have to be changed depending on the customization. > // > // > > // > /////////////////////////////////////////////////////////////////////////// > //////////////// > */ > > /*// > Load the proper visualization chart. > */// > google.load('visualization', '1', {'packages': > ['annotatedtimeline']}); //change this line if a different type of > chart is desired > > /* > Call to the function after the rest of the page has been loaded > */ > google.setOnLoadCallback(createListItems); > /* > Create the object which retrieves the data from the appropriate list. > */ > function createListItems() { > // Change these two variables to what is needed for your chart. > ///////////////////////////////////////////// > var siteURL = "https://pmev2.bah.com/sites/BRAC/Chart";; //URL > of the > site in which the list is contained. > var listName = "Facility and Staff Requirements"; //Name of > the list > ///////////////////////////////////////////// > //Necessary to create the object with the list items. > //Each item is a row containing the String values of each > cell of > the SharePoint list. > var itemsObject = jP.Lists.setSPObject(siteURL, > listName).getSPView().Items; > dispItemsVisualization(itemsObject); > }; > > /* > Populate the DataTable with list data items. > Create the MotionChart object. > Draw the MotionChart. > Parameter: an "items" object which contains all the data from a > SharePoint list > */ > function dispItemsVisualization(items) { > var cols = {}; //object which contains the column names > var columnIndex = 0; //keep track of which column is > currently being > queried or populated > var rowIndex = 0; //keep track of which row is currently being > queried or populated > var temp = new Array(); //array used when splitting and > reformatting > Strings > var temp2 = new Array(); //array used when splitting and > reformatting Strings > var data = new google.visualization.DataTable(); //DataTable > object > > //for each object in the item contained in items[0] perform > the > function > $.each(items[0], function(colName) { > if(columnIndex<6) { > cols[colName] = colName; // create and > populate a hash containing > all the column headers > columnIndex++; > } > }); > columnIndex = 0; > //*****DataTable Set Up***** > //add columns for the google DataTable > ///////////////////////////////////////////////////////// > data.addColumn('date', 'Date'); > data.addColumn('number', 'Staff'); > data.addColumn('number', 'Facility Requirements'); > //add Rows for the DataTable based on how many items were > retrieved > from the list > data.addRows(items.length); > ////////////////////////////////////////////////////////// > > //For each object retrieved from the item list, fill the > appropriate > cell > //of the DataTable with the appropriate data > $.each(items, function(itemIndex, itemObject) { > $.each(cols, function(colIndex, colName) { > if(columnIndex< 3) { > //the 2nd column of the DataTable > requires a Date, so formatting > must take place > if(columnIndex == 0) { > temp = > itemObject[colName].split('-');//split the "date" string > into Year, Month, Day Time > temp2 = temp[2].split(' '); > //split Day Time into Day, Time. Use > only Day, Time is unused > > data.setValue(rowIndex,columnIndex, new Date(temp[0]*1, > (temp[1]*1)-1,(temp2[0]*1))); > } > //the 3rd and 4th columns require > numbers so the String is > converted to some number datatype > else if(columnIndex == 1) { > > data.setValue(rowIndex,columnIndex, itemObject[colName]*1); // > when a string is multiplied it is automatically converted to int if > applicable > } > //the last two columns are formatted > strangely because they are > calculated columns therefore we must reformat them so they can be used > else { > temp = > itemObject[colName].split('#'); //we only care about the > 2nd half of this split, which contains the number > > data.setValue(rowIndex,columnIndex, temp[1]*1);//multiplied by 1 > to convert to string > } > columnIndex++; > } > }); > columnIndex = 0; > rowIndex++; > }); > var chart = new > google.visualization.AnnotatedTimeLine(document.getElementById('timechart_d > iv')); > //After the chart is created, draw with the data we queried > as a > parameter. > chart.draw(data); > } > </script> > <div id="timechart_div" style="width: 750px; height: 400px;"></div> > > Sorry for the excessive amount of comments. I am just trying to make > it as readable as possible to coworkers that might not understand > Javascript as clearly as others. > > On Jul 7, 10:17 am, ChartMan <chart...@google.com> wrote: > > > > > Can you provide a code snippet/example ? > > > On Wed, Jul 7, 2010 at 5:13 PM, Marlow <marlowena...@gmail.com> wrote: > > > ChartMan, > > > At first I was and then I made the appropriate changes so no longer > > > am. > > > The problem still persists. > > > > On Jul 7, 10:02 am, ChartMan <chart...@google.com> wrote: > > > > Maybe you are using the same div for both of them > > > > > ChartMan > > > > > On Wed, Jul 7, 2010 at 3:54 PM, Marlow <marlowena...@gmail.com> wrote: > > > > > Hi everyone, I'm having trouble displaying two different charts. I am > > > > > using sharepoint and trying to display both charts on the same page in > > > > > different content editor web parts.But for some reason, when i link > > > > > the two Javascripts that I am using to display the charts, only the > > > > > 2nd chart appears. Has anyone done something similar and run into the > > > > > same problem? > > > > > When I try to display just one of these charts, they both display just > > > > > fine. > > > > > Any help will be greatly appreciated :D > > > > > > -- > > > > > You received this message because you are subscribed to the Google > > > Groups > > > > > "Google Visualization API" group. > > > > > To post to this group, send email to > > > > > google-visualization-...@googlegroups.com. > > > > > To unsubscribe from this group, send email to > > > > > google-visualization-api+unsubscr...@googlegroups.com<google-visualization- > > > > > api%2bunsubscr...@googlegroups.com><google-visualization- > > > api%2bunsubscr...@googlegroups.com <api%252bunsubscr...@googlegroups.com>> > > > > > . > > > > > For more options, visit this group at > > > > >http://groups.google.com/group/google-visualization-api?hl=en. > > > > -- > > > You received this message because you are subscribed to the Google Groups > > > "Google Visualization API" group. > > > To post to this group, send email to > > > google-visualization-...@googlegroups.com. > > > To unsubscribe from this group, send email to > > > google-visualization-api+unsubscr...@googlegroups.com<google-visualization- > > > api%2bunsubscr...@googlegroups.com> > > > . > > > For more options, visit this group at > > >http://groups.google.com/group/google-visualization-api?hl=en. -- You received this message because you are subscribed to the Google Groups "Google Visualization API" group. To post to this group, send email to google-visualization-...@googlegroups.com. To unsubscribe from this group, send email to google-visualization-api+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.
