Я пытаюсь изменить цвет диаграмм в электронной таблице Google. Это работает для всех диаграмм на одном листе.
function colorChart() {
let $Sheet = SpreadsheetApp.getActiveSheet();
let $Charts = $Sheet.getCharts();
let $Colors = {
'One': '#6E6E6E',
'Two': '#FFED00',
'Three': '#238C96',
};
for (let $i in $Charts) {
let $Chart = $Charts[$i].modify()
.setOption('series.0.color', $Farben['One'])
.setOption('series.1.color', $Farben['Two'])
.setOption('series.2.color', $Farben['Three'])
.build();
$Sheet.updateChart($Chart);
}
}
В документации я могу найти только getCharts()
, который возвращает массив всех диаграмм на активном листе.
Можно ли получить только выбранный график?
К сожалению, здесь нет ответа на вопрос: Как получить информацию о графике из выбранного графика в активной таблице? (скрипт приложений Google)
Использование $Sheet.getCharts()[0]
, как упоминалось в посте, не работало, так как была возвращена только первая диаграмма листа.
Для уверенности. Что ты посоветуешь?
Проблема здесь в том, что класс SpreadsheetApp в Apps Script, по-видимому, не имеет специального метода для выбора chart
или любых подвижных/изменяемых по размеру элементов на листе, а только для выбранных ячеек/строк.
В качестве обходного пути, возможно, вы можете попробовать реализацию с использованием пользовательской HTML-страницы, которая даст вам возможность просматривать созданные в настоящее время диаграммы с листа (через пользовательское меню и пользовательскую боковую панель), и оттуда вы сможете иметь возможность выберите диаграмму из этого HTML-интерфейса и примените изменения.
ПРИМЕЧАНИЕ. Члены сообщества не пишут код за вас, но вы можете использовать приведенные ниже примеры кодов (полученные из нескольких примеров кодов, найденных в Интернете), чтобы начать работу.
Code.gs
/**Creates a custom menu to load an edit chart sidebar.*/
function onOpen() {
SpreadsheetApp.getUi() // Or DocumentApp or SlidesApp or FormApp.
.createMenu('Edit Chart')
.addItem('Start', 'showSidebar')
.addToUi();
}
/**Shows the custom html sidebar.*/
function showSidebar() {
var html = HtmlService.createHtmlOutputFromFile('Page')
.setTitle('Edit Charts');
SpreadsheetApp.getUi()
.showSidebar(html);
}
/**Function to return the current charts on a sheet.*/
function getCurrentChartsOnSheet() {
var charts = buildMenu();
return charts;
}
/**Function to get the current charts on a sheet.*/
function buildMenu() {
var getChartsMenu = [];
let $Sheet = SpreadsheetApp.getActiveSheet();
let $Charts = $Sheet.getCharts();
for (let $i in $Charts) {
var currentChart = $Charts[$i].getOptions().get('title');
getChartsMenu.push([$i + ' - ' + (currentChart.length < 1 ?
$Charts[$i].modify().getChartType().toString() : currentChart)])
}
return getChartsMenu; //Structure of the array will be: [chart index #] - [Chart type]
}
/**Function to edit the selected chart.*/
function editSelectedChart(selection) {
let $Sheet = SpreadsheetApp.getActiveSheet();
let $Charts = $Sheet.getCharts();
let $Colors = {
'One': '#6E6E6E',
'Two': '#FFED00',
'Three': '#238C96',
};
let $Chart = $Charts[selection.match(/\d+/g)].modify()
.setOption('series.0.color', $Colors['One'])
.setOption('series.1.color', $Colors['Two'])
.setOption('series.2.color', $Colors['Three'])
.build();
$Sheet.updateChart($Chart);
}
Page.html
<!DOCTYPE html>
<html>
<title>Edit Charts</title>
<head>
<style>
.space {
width: 4px;
height: auto;
display: inline-block;
}
</style>
<script>
google.script.run.withSuccessHandler(onSuccess).getCurrentChartsOnSheet();
function onSuccess(data) {
var select = document.getElementById("selectChart");
var options = data;
for(var i = 0; i < options.length; i++) {
var opt = options[i];
var el = document.createElement("option");
el.textContent = opt;
el.value = opt;
select.appendChild(el);
}
}
function passSelectedChart(){
var e = document.getElementById("selectChart");
google.script.run.editSelectedChart(e.value); //<-- PASS the selected drop-down data to GOOGLE SCRIPT function named editSelectedChart()
}
</script>
</head>
<body>
<h3>Choose a chart to edit:</h3>
<select id = "selectChart">
<option>No Selection</option>
</select>
<div>
<p><input type = "button" value = "Apply" onclick = "passSelectedChart()"></p>
</div>
<div>
<p><input type = "button" value = "Close" onclick = "google.script.host.close()"></p>
</div>
</body>
</html>
@Alex Надеюсь, это поможет вам.
Спасибо @SputnikDrunk2, это работает.
Интересно, почему вы используете функцию getCurrentChartsOnSheet()
вместо прямого вызова buildMenu()
. В чем преимущество этого способа?
Не очень удобно использовать типы диаграмм в качестве описания. Вместо этого я бы предложил использовать $Charts[$i].getOptions().get('title')
. Который работает, пока есть заголовок, и возвращает меня к первоначальному вопросу.
@Alex извиняюсь за путаницу, я отделил getCurrentChartsOnSheet()
от вызова buildMenu()
только для удобочитаемости, когда тестировал его. Я знаю, что это избыточно, поэтому вместо этого вы могли бы вызвать buildMenu()
в своем реальном коде. Что касается названий диаграмм, я понял вашу точку зрения с названиями вместо использования типов диаграмм, так как это имеет больше смысла. Я сделал небольшое изменение в строке для нажатия названий графиков. Будет использоваться название диаграммы (если доступно), в противном случае будет использоваться тип диаграммы.
Кажется, это невозможно. Хотите вместо этого проверить возможный обходной путь?