儀表板到StackPanel

Question

我得到一個'對象類型不匹配列類型'的錯誤，不知道爲什麼...不知道如果它在我的代碼中有錯誤（更可能）或如果它只是不會接受儀表板。我在想，我的錯誤與數據源有關，以及我如何從電子表格中提取數據。

function doGet() { 
    var app = UiApp.createApplication().setTitle('DHS: Kurzweil Calendar'); 

    //Create stack panel 
    var stackPanel = app.createStackPanel().setSize('100%', '100%'); 
    var info = about(app); 
    var p1 = app.createVerticalPanel().setId('vrtPanel1').add(info); 
    var cal = calendar(app); 
    var p2 = app.createVerticalPanel().setId('vrtPanel2').add(cal); 
    var form = formBuild(app); 
    var p3 = app.createVerticalPanel().setId('vrtPanel3').add(form); 

    //add widgets to each stack panel, and name the stack panel 
    stackPanel.add(p1, 'About the Lab'); 
    stackPanel.add(p2, 'Lab Calendar'); 
    stackPanel.add(p3, 'Lab Scheduling'); 

    //Add the panel to the application 
    app.add(stackPanel); 
    return app; 
} 

function about(app){ 
    return app.createHTML('<br />' + 
         '<p>The Kurzweil Lab at Davie High School supports <i>20 independent student workstations</i> and is designed for the specific use of Kurzweil software. The lab\'s main objective is to support students who have a Read-Aloud accommodation on their Individual Education Plan (IEP). If a student does not have a Read-Aloud accommodation, but has another accommodation like: Separate Setting, Extended Time, or English as a Second Language (ESL) then they are welcome in the lab as long as the lab is not full. If the lab reaches capacity and Read-Aloud students need to use Kurzweil, the student(s) without a Read-Aloud accommodation or who are refusing their Read-Aloud accommodation will be asked to go back to their classroom so that the teacher can make other arrangements for that student.</p>' + 
         '<p>During non-testing situations the Kurzweil Lab can be scheduled by EC teachers to help with study skills, individual projects, or other work that requires the use of a computer lab.</p>', true); 
} 

function calendar(app){ 
    // Create Data Source 
    var ss = SpreadsheetApp.openById('0Aur3owCpuUY-dGJIOGZ1LXhqT2FNMGVXSGNJazFnUmc'); 
    var datasource = ss.getSheetByName('Schedule').getRange(1,1,ss.getLastRow(),ss.getLastColumn()); 

    // Create Charts and Controls 
    var dateFilter = Charts.newCategoryFilter() 
     .setFilterColumnLabel("Date").build(); 
    var teacherFilter = Charts.newCategoryFilter() 
     .setFilterColumnLabel("Teacher").build(); 
    var subjectFilter = Charts.newCategoryFilter() 
     .setFilterColumnLabel("Subject").build(); 
    var periodFilter = Charts.newCategoryFilter() 
     .setFilterColumnLabel("Period").build(); 
    var typeFilter = Charts.newCategoryFilter() 
     .setFilterColumnLabel("Type").build(); 
    var tableChart = Charts.newTableChart().build(); 

    //Create and bind Dashboard 
    var dashboard = Charts.newDashboardPanel() 
     .setDataTable(datasource) 
     .bind([dateFilter, teacherFilter, subjectFilter, periodFilter, typeFilter], [tableChart]) 
     .build(); 

    //Create Application 
    dashboard.add(app.createVerticalPanel() 
       .add(app.createHorizontalPanel() 
        .add(dateFilter).add(teacherFilter).add(subjectFilter).add(periodFilter).add(typeFilter) 
        .setSpacing(70)) 
       .add(app.createHorizontalPanel() 
        .add(tableChart) 
        .setSpacing(10))); 

    //Add the panel to the application 
    app.add(dashboard); 
    return app; 
} 

Answer 1

你根本都忘了，你改變了每一個構建UI函數返回的數據... ...如果你還記得your first post about stackPanels我們改變了呼叫

var cal = calendar(app); 

然後

var p2 = app.createVerticalPanel().setId('vrtPanel2').add(cal); 

所以我們顯然希望得到一個Ui對象（一個小部件）作爲回報。

您可以簡單地改變function calendar(app){結束象下面這樣：

... 
    dashboard.add(app.createVerticalPanel() 
       .add(app.createHorizontalPanel() 
        .add(dateFilter).add(teacherFilter).add(subjectFilter).add(periodFilter).add(typeFilter) 
        .setSpacing(70)) 
       .add(app.createHorizontalPanel() 
        .add(tableChart) 
        .setSpacing(10))); 

    //Add the panel to the application 
    return dashboard;// return the dashboard itself, not the app. 
} 

---

編輯：這是絕對簡單的是真實的......我的答案是正確的，但顯然不包括儀表板建築問題。

一些研究之後（我從來沒有使用之前圖表服務），我來到這個代碼，不會產生錯誤，但我絕對不知道它返回你想要的東西......

儘管如此，它應該幫助你找到自己的路。 （不要怪我，如果它看起來不正確;-)

function calendar(app){ 
    // Create Data Source 
    var ss = SpreadsheetApp.openById('0Aur3owCpuUY-dGJIOGZ1LXhqT2FNMGVXSGNJazFnUmc'); 
    var sh = ss.getSheetByName('Schedule'); 
    var datasource = sh.getRange(1,2,sh.getLastRow(),sh.getLastColumn()).getValues(); 
    Logger.log(datasource) 
    var dataTable = Charts.newDataTable(); 
    for(var j in datasource[0]){ 
    dataTable.addColumn(Charts.ColumnType.STRING, datasource[0][j]); 
    } 
    for(var i = 1; i < datasource.length; ++i){ 
    dataTable.addRow(datasource[i].map(String)); 
    } 
var dashboard = Charts.newDashboardPanel().setDataTable(dataTable); // Create Charts and Controls 
    var dateFilter = Charts.newCategoryFilter() 
     .setFilterColumnLabel("Date").setDataTable(dataTable).build(); 
    var teacherFilter = Charts.newCategoryFilter() 
     .setFilterColumnLabel("Teacher").setDataTable(dataTable).build(); 
    var subjectFilter = Charts.newCategoryFilter() 
     .setFilterColumnLabel("Subject").setDataTable(dataTable).build(); 
    var periodFilter = Charts.newCategoryFilter() 
     .setFilterColumnLabel("Period").setDataTable(dataTable).build(); 
    var typeFilter = Charts.newCategoryFilter() 
     .setFilterColumnLabel("Type").setDataTable(dataTable).build(); 
    var tableChart = Charts.newTableChart().setDimensions(1000, 600).setDataTable(dataTable).build(); 

    //Create and bind Dashboard 
    var dashboard = Charts.newDashboardPanel() 
     .setDataTable(dataTable) 
     .bind([dateFilter, teacherFilter, subjectFilter, periodFilter, typeFilter], [tableChart]) 
     .build(); 

    //Create Application 
    var dashBoardPanel = app.createVerticalPanel() 
    dashBoardPanel.add(app.createHorizontalPanel() 
        .add(dateFilter).add(teacherFilter).add(subjectFilter).add(periodFilter).add(typeFilter) 
        .setSpacing(30)); 
    dashBoardPanel.add(tableChart); 

    //Add the panel to the application 
    return dashBoardPanel; 
} 

---

編輯2：獲得第一列，你需要稍微修改填充dataTables的for loops日期以便您可以僅從第二列轉換爲字符串。

我做的是這樣的：「對象類型不匹配列類型」

function calendar(app){ 
     // Create Data Source 
     var ss = SpreadsheetApp.openById('0Aur3owCpuUY-dGJIOGZ1LXhqT2FNMGVXSGNJazFnUmc'); 
     var sh = ss.getSheetByName('Schedule'); 
     var datasource = sh.getRange(1,1,sh.getLastRow(),sh.getLastColumn()).getValues(); 
     Logger.log(datasource) 
     var dataTable = Charts.newDataTable(); 
     dataTable.addColumn(Charts.ColumnType.DATE, datasource[0][1]); 
     for(var j=2 ;j< datasource[0].length ;++j){ 
     dataTable.addColumn(Charts.ColumnType.STRING, datasource[0][j]); 
     } 
     for(var i = 1; i < datasource.length; ++i){ 
     var datarow = []; 
     datarow.push(datasource[i][1]); 
     for(var j=2 ;j< datasource[0].length ;++j){ 
      datarow.push(datasource[i][j].toString()); 
     } 
     dataTable.addRow(datarow); 
     } 
     var dashboard = Charts.newDashboardPanel().setDataTable(dataTable); // Create Charts and Controls 
      ...