Обмен данными из .gs (Google Apps Script) в переменную <script>в html - PullRequest
Новая
       32

Обмен данными из .gs (Google Apps Script) в переменную <script>в html

1 голос
/ 25 марта 2020 
[
  {"id":1,"label":"Node 2"},
  {"id":2,"label":"Node 3"},
  {"id":3,"label":"Node 4"},
  {"id":4,"label":"Node 5"}
]

Привет! В следующем коде функция getArray () возвращает эту строку ↑. Вы знаете, как связать его с переменной узлов в. html. Я вставил коды, спасибо! 

function getArray(){
  var ss = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
  const data = ss.getRange(1,1,ss.getLastRow()-1,2).getValues();

  let objArray = []
  data.forEach(element => {
    let obj = {}
    obj.id = element[0]
    obj.label = element[1]
    objArray.push(obj)
    return element
    }
  )
var obj = JSON.stringify(objArray);
//Logger.log(obj);
return obj;
}

<!doctype html>
<html>
<head>
  <title>Network</title>
</head>
<body>
<div id="mynetwork"></div>
<script type="text/javascript">

var nodes = [
  {"id":1,"label":"Node 2"},
  {"id":2,"label":"Node 3"},
  {"id":3,"label":"Node 4"},
  {"id":4,"label":"Node 5"}
];

</script>
</body>
</html>

Резюме: Моя цель - использовать возвращенный "obj" в .gs как var "node" в. html. Я не знаю, правильная ли речь о программировании. Спасибо!

Если кто-то может поделиться со мной кодом, я буду вам большое спасибо!

1 Ответ

1 голос
/ 25 марта 2020

Как насчет этой модификации? Пожалуйста, подумайте об этом, как об одном из нескольких возможных ответов.

Точки модификации:

  • В этом ответе значение nodes получается с помощью google.script.run.
  • На getArray() на стороне ГАЗА значение возвращается как объект.
  • На Javascript стороне объект nodes используется для виз. js.

Модифицированный скрипт

Сторона скрипта Google Apps: 

function showBox() {
   var template = HtmlService.createTemplateFromFile("Map");
   var html = template.evaluate();
   html.setHeight(450).setWidth(650);
   SpreadsheetApp.getUi().showModalDialog(html, "New Title");
}

function getArray(){
  var ss = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
  const data = ss.getRange(1,1,ss.getLastRow()-1,2).getValues();

  let objArray = []
  data.forEach(element => {
    let obj = {}
    obj.id = element[0]
    obj.label = element[1]
    objArray.push(obj)
    return element
    }
  )
  return objArray;  // Modified
}

HTML и Javascript сторона: 

<!doctype html>
<html>
<head>
  <title>Network</title>
  <script type="text/javascript" src="https://unpkg.com/vis-network/standalone/umd/vis-network.min.js"></script>
  <style type="text/css">
    #mynetwork {
      width: 600px;
      height: 400px;
      border: 1px solid lightgray;
      margin-left: auto;
      margin-right: auto;
    }
  </style>
</head>
<body>
<div id="text"></div>
<div id="mynetwork"></div>
<script type="text/javascript">

// Modified
google.script.run.withSuccessHandler(nodes => {
  var edges = [{from: 1, to: 3}, {from: 1, to: 2}, {from: 2, to: 4}, {from: 2, to: 5}, {from: 3, to: 3}];
  var container = document.getElementById('mynetwork');
  var data = {nodes: nodes, edges: edges};
  var options = {edges: {smooth: false}, physics: {enabled: false}};
  var network = new vis.Network(container, data, options);
}).getArray();

</script>
</body>
</html>

Ссылка:

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...