웹 사이트에 Google Charts 대시 보드 포함하기

Google Script를 사용하여 Google Charts 대시 보드를 만들었습니다. 웹 앱으로 배포 할 때 제대로 작동합니다. 대시 보드를 HTML 페이지에 임베드하는 방법이 있는지 궁금합니다. UI 서비스 대신 HTML 서비스를 사용해 보았지만 대시 보드를 표시하는 대신 "UIApplication"이라고 표시했습니다. 다음은 대시 보드 및 HTML 페이지의 코드입니다. 구글 스크립트웹 사이트에 Google Charts 대시 보드 포함하기

대시 보드

function doGet() { 

    return HtmlService 
     .createTemplateFromFile('index') 
     .evaluate(); 
} 

function createDashboard() { 

var ss = SpreadsheetApp.openById('0Ar1JYhAF9RNsdENWZE9fdUw1ZlJwRENDRndlY3UzT2c'); 
var sheet = ss.getSheetByName('Charts'); 
var data = sheet.getDataRange(); 

    var completeFilter = Charts.newCategoryFilter().setFilterColumnIndex(0).build(); 

    var tableChart = Charts.newTableChart() 
    .setDataViewDefinition(Charts.newDataViewDefinition().setColumns([0,1])) 
    .build(); 

    var pieChart = Charts.newPieChart() 
    .setDataViewDefinition(Charts.newDataViewDefinition().setColumns([0,1])) 
    .setTitle('Number of completed tasks') 
    .build(); 

    var dashboard = Charts.newDashboardPanel().setDataTable(data) 
    .bind([completeFilter], [tableChart, pieChart]) 
    .build(); 

    var app = UiApp.createApplication(); 
    var headerPanel = app.createHorizontalPanel(); 
    headerPanel.add(app.createHTML("<center><h1>Welcome to the Charts Dashboard</h1></center>")); 


    var filterPanel = app.createVerticalPanel(); 
    var chartPanel = app.createHorizontalPanel(); 
    filterPanel.add(completeFilter).setSpacing(10); 
    chartPanel.add(tableChart).add(pieChart).setSpacing(10); 

    dashboard.add(app.createVerticalPanel().add(headerPanel).add(filterPanel).add(chartPanel)); 
    app.add(dashboard); 

    return app; 
}

HTML 페이지

<html> 
<head> 
<title> Google Charts Dashboard </title> 
</head> 
<body> 
<h1> Welcome to the Charts Dashboard </h1> 
<p>Hello, world! The charts are below: </p> 
<p><? var data = createDashboard(); ?> </p> 
<p> <?= data ?> </p> 
</body> 
</html>

사람이 왜 일하거나 가능한 경우되지 않습니다 알고 있나요? 어떤 도움을 주셔서 감사합니다.

출처

2014-04-04 Harry12345

내 경험에 의하면 가장 간단한 방법은 iFrame을 사용하는 것입니다. 현재 위치 인 iFrame에 대한 세부 정보를 찾을 수 있습니다 기본적으로 http://www.w3schools.com/tags/tag_iframe.asp

, 당신은 당신의 웹 애플리케이션의 URL이 필요하고 (당신의 웹 애플리케이션에서 하나 표시된 URL 대체)이 같은 iframe에 넣어 :

을 이렇게하면 대시 보드를 표시하려는 모든 곳에서 HTML에 표시됩니다. 높이, 너비 등을 설정하는 몇 가지 옵션이 있으므로 실험 해보십시오.

(참고 : HTML을 작성하는 것에 대해 이야기하고 있으므로 사용중인 g 사이트 페이지가 아니라고 가정하고 있습니다. 그렇다면 수동으로 g 프레임에 HTML을 사용하여 iFrame을 삽입 할 수 없습니다. 그러나 iFrame 가젯을 사용할 수 있습니다. 가젯을 삽입하고 추가 가젯 ... iFrame을 선택하면 가젯을 찾을 수 있습니다. 가젯을 삽입하면 가젯 설정에 가젯을 넣을 위치가 생깁니다. 귀하의 가제트의 URL)

출처

2014-04-04 12:33:42 living2serve

나는 그것을 이미 시도했지만 작동하지 않을 수 있습니다. 왜냐하면 웹 앱으로 배포 할 때만 회사 도메인 내에서 공유 할 수 있기 때문일 수 있습니다. – Harry12345

다른 Google 계정으로 복사하여 익명 사용자도 허용하도록 설정 한 다음 해당 링크를 사용했지만 여전히 작동하지 않았습니다. – Harry12345

웹 사이트에 Google Charts 대시 보드 포함하기

답변

관련 문제