1

Здравствуйте, я очень новичок во всем, что я пытаюсь сделать здесь, я постараюсь как можно подробнее рассказать о своей проблеме.таблица визуализации google allowHtml не работает на сайтах google

Я пытаюсь получить html-рендеринг в таблице визуализации Google, используя скрипт google-apps на сайтах google. В качестве тестового примера я привел этот точный пример из документов визуализации google и попробовал его на своей странице, но html не работает, он отображается только как текст.

На моей странице у меня есть гаджет приложение-скрипт, вставленный который вызывает Класс HtmlService как так ...

function doGet() { 
    return HtmlService.createHtmlOutputFromFile('testTable'); 
} 

В testTable.html я скопировал этот точный код из документации, за исключением, что я установил allowHtml в true в параметрах таблицы и добавил некоторые ярлыки html bold вокруг двух записей таблицы, чтобы проверить правильность рендеринга html. Как это ..

<html> 
    <head> 
    <script type="text/javascript" src="https://www.google.com/jsapi"></script> 
    <script type="text/javascript"> 
     google.load("visualization", "1", {packages:["table"]}); 
     google.setOnLoadCallback(drawTable); 

     function drawTable() { 
     var data = new google.visualization.DataTable(); 
     data.addColumn('string', 'Name'); 
     data.addColumn('number', 'Salary'); 
     data.addColumn('boolean', 'Full Time Employee'); 
     data.addRows([ 
      ['<b>Mike</b>', {v: 10000, f: '$10,000'}, true], 
      ['<b>Jim</b>', {v:8000, f: '$8,000'}, false], 
      ['Alice', {v: 12500, f: '$12,500'}, true], 
      ['Bob', {v: 7000, f: '$7,000'}, true] 
     ]); 

     var table = new google.visualization.Table(document.getElementById('table_div')); 

     table.draw(data, {showRowNumber: true, allowHtml: true}); 
     } 
    </script> 
    </head> 
    <body> 
    <div id="table_div"></div> 
    </body> 
</html> 

Я сделал этот же пример в JSFiddle, и он визуально отображает полужирные html-теги. Есть ли что-то, что мне нужно сделать по-другому, чтобы позволить allowHtml работать на моем сайте Google?

+0

Вы хотите, чтобы только те ячейки были выделены жирным шрифтом или каждая ячейка была выделена жирным шрифтом? – rpm

+0

Либо или ...Это не обязательно смелое, что мне нужно, я просто пытаюсь заставить параметр allowHtml работать, и я использую жирные теги в качестве тестового примера. В конце концов, я захочу сделать больше с html внутри ячейки, мне просто нужно заставить его работать. – claybar

+0

Это должно работать, работая в jsfiddle. Мне кажется, ошибка. Вы можете сообщить об этом [здесь] (https://developers.google.com/apps-script/support#bugs). – rpm

ответ

1

Я нашел работу вокруг, которая решила мою проблему. Вместо того, чтобы отображать таблицу с помощью скрипта google-apps, вставленного непосредственно на страницу, я помещаю свой код в файл .xml, размещенный на моем Google Диске, и вставил его как гаджет на моей странице.

Вот такая же таблица сверху только в форме гаджета (.xml), которая теперь правильно отображает HTML на странице сайта Google.

<?xml version = "1.0" encoding="UTF-8" ?> 
<Module> 
    <ModulePrefs title = "Test Table"> 
    </ModulePrefs> 
    <Content type="html"> 
    <![CDATA[ 
     <div id="table_div"></div> 
     <script type="text/javascript" src="https://www.google.com/jsapi"></script> 
     <script type="text/javascript"> 
     google.load("visualization", "1", {packages:["table"]}); 
     google.setOnLoadCallback(drawTable); 

     function drawTable() { 
      var data = new google.visualization.DataTable(); 
      data.addColumn('string', 'Name'); 
      data.addColumn('number', 'Salary'); 
      data.addColumn('boolean', 'Full Time Employee'); 
      data.addRows([ 
      ['<b>Mike</b>', {v: 10000, f: '$10,000'}, true], 
      ['<b>Jim</b>', {v:8000, f: '$8,000'}, false], 
      ['Alice', {v: 12500, f: '$12,500'}, true], 
      ['Bob', {v: 7000, f: '$7,000'}, true] 
      ]); 

      var table = new google.visualization.Table(document.getElementById('table_div')); 

      table.draw(data, {showRowNumber: true, allowHtml: true}); 
     } 
    </script> 
    ]]> 
    </Content> 
</Module> 
0

Заканчивать этот пост здесь на StackOverflow:

google visualization not working with appscript html service

Вот документация о том, как добавить таблицу визуализации в Google Site.

Embed Visualizations on Google Sites

Я бы попробовать добавить визуализации таблицы без использования Apps Script.

Я думаю, что существует проблема с сахацией кода Caja при попытке добавить таблицу визуализации с помощью скрипта приложений. Я использую код из примеров документации и получения ошибок в консоли браузеров.

Я добавил скрипт приложений на свой сайт с некоторыми изменениями и получил это.

HTML in Sites

Является ли это то, что вы хотите?

Я использовал свой точный HTML, но разные doGet() функции:

function doGet(){ 
    return HtmlService.createTemplateFromFile('testTable') 
    .evaluate() // evaluate MUST come before setting the NATIVE mode 
    .setSandboxMode(HtmlService.SandboxMode.NATIVE); 
}; 

Я добавил Apps Script путем редактирования страницы, выбрав в меню ВСТАВКА, выбирая Apps Script, и выбор Apps Script из списка, который я который был прикреплен к сайтам.

+0

Спасибо, что проверили. На самом деле я надеюсь, что имена, которые я добавил «» тегов (Майк и Джим в таблице), будут отображаться как отображаемые html в таблице. Поэтому в этом случае желаемый результат состоит в том, что «Майк» и «Джим» выделены жирным шрифтом, а не просто показывают теги в таблице. – claybar

+0

Ох ... Да, я вижу это сейчас. :) Ладно, может быть, я еще кое-что проверю. –

Смежные вопросы