Замените переменную на google.script.run - PullRequest
1 голос
/ 25 марта 2020

Я очень простой c в js, и у меня есть небольшая проблема со следующим кодом.

Как связать var edges = [{from: 1, to: 3}, {from: 1, to: 2}, {from: 2, to: 4}, {from: 2, to: 5}, {from: 3, to: 3}]; (на стороне HTML и Javacript) с видом getArray() (на стороне скрипта Google), чтобы получить аналогичный результат этого поста Обмен данными из .gs (Google Apps Script) в переменную в html, но с «краями» вместо «узлов»?

Это может быть google.script.run.withSuccessHandler(nodes, edges => {...}).coneArray().edgeArray();?

Google Script Side

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

function include() {
  return HtmlService.createHtmlOutputFromFile().getContent();
}

//-----------------------------------------------------------------------------------Global variables

var ss = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();

//-----------------------------------------------------------------------------------Nodes function

function coneArray(){

  const data = ss.getRange(2,1,ss.getLastRow()-1,5).getValues();

  let nodeArray = []

  data.forEach(element => {
    let obj = {}
    obj.id = element[4]
    obj.label = element[0]
    obj.group = element[1]
    obj.x = element[2]
    obj.y = element[3]
    nodeArray.push(obj)
    return element
    }
  )
  Logger.log(nodeArray);
  return nodeArray;
}

//-----------------------------------------------------------------------------------Edges function

function lineArray(){

  const data = ss.getRange(2,5,ss.getLastRow()-1,2).getValues();

  let edgArray = []

  data.forEach(element => {
    let obj = {}
    obj.to = element[1]
    obj.from = element[0]
    edgArray.push(obj)
    return element
    }
  )
  Logger.log(edgArray);
  return edgArray;
}

HTML и Javacript Side

<!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>
<input type="button" value="Reload" onclick="google.script.run.showBox()" />
<div id="mynetwork"></div>
<script type="text/javascript">

var container = document.getElementById('mynetwork');
var options = {edges: {smooth: false}, physics: {enabled: false}, nodes: {shape: "square",size: 10}};

var edges = [{from: 1, to: 3}, {from: 1, to: 2}, {from: 2, to: 4}, {from: 2, to: 5}, {from: 3, to: 3}];

google.script.run.withSuccessHandler(nodes => {
  var data = {nodes: nodes, edges: edges};
  var network = new vis.Network(container, data, options);
}).coneArray();

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

Перед рукой большое спасибо!

PS: цель состоит в том, чтобы соединить узлы с данными ребер в электронных таблицах Google.

PS: I поделиться всем кодом, потому что, не будет смысла в части.

1 Ответ

2 голосов
/ 25 марта 2020
  • В вашей ситуации в скрипте Служб Google есть 2 функции coneArray() и edgeArray(). Вы хотите извлечь значения из обеих функций и, используя значения, вы хотите использовать vis. js.

Я мог бы понять, как выше. Если мое понимание верно, как насчет следующей модификации?

В этой модификации значения извлекаются как coneArray(), так и edgeArray(), а полученные значения используются для vis. js.

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

Пожалуйста, добавьте следующий скрипт в скрипт Google Apps.

const sample = () => ([coneArray(), edgeArray()]);

HTML и Javascript сторона:

Пожалуйста, замените ваш скрипт google.script.run следующим образом.

google.script.run.withSuccessHandler(([nodes, edges]) => new vis.Network(container, {nodes: nodes, edges: edges}, options)).sample();

Примечание:

  • Если вы хотите вызывать каждую функцию из Javascript, вы также можете используйте следующий Javascript в качестве простого скрипта. Но я бы хотел порекомендовать выше модифицированный скрипт.

    google.script.run.withSuccessHandler(nodes => {
      google.script.run.withSuccessHandler(edges => {
        new vis.Network(container, {nodes: nodes, edges: edges}, options)
      }).edgeArray();
    }).coneArray();
    
...