【发布时间】:2021-12-30 05:58:22
【问题描述】:
我想更新/修改现有的谷歌图表选项。假设我想通过单击按钮将新选项应用于现有图表。
单击“修改图表”按钮时,图表选项会更新(例如设置新颜色)。
奇怪的是图表类型从组合图变成了折线图。为什么会这样?即使我在选项中传递了chartType: 'ComboChart',图表类型仍然会改变。
非常感谢您的帮助。
function nuChart(d, t, a, h, x, y, st, is) {
let obj = document.getElementById(d);
if (obj == null) return;
a = eval(a);
if (a.length === 0) { return; }
try {
google.charts.load('current', { 'packages': ['corechart'] });
} catch (error) {
return;
}
google.charts.setOnLoadCallback(drawVisualization);
if (a == '') { return; }
function drawVisualization() {
if (a === undefined) { return; }
let data = google.visualization.arrayToDataTable(a);
let wrapper = new google.visualization.ChartWrapper({
chartType: t,
dataTable: data,
containerId: d,
options: {
title: h,
vAxis: { title: y },
hAxis: { title: x },
seriesType: st,
isStacked: is,
}
});
wrapper.draw();
window[d + '_wrapper'] = wrapper;
}
}
function nuTestChart() {
let a = [
['Month', 'Shane', 'Dave', 'Adam', 'Paul', 'Chris'],
['2019', 100, 200, 300, 400, 500],
['2020', 165, 238, 322, 498, 550],
['2021', 165, 938, 522, 998, 450],
['2022', 135, 1120, 599, 1268, 288]
];
nuChart('google_chart', 'ComboChart', a, 'title', '', '', 'bars', false);
}
nuTestChart();
function nuModifyChart() {
let wrapper = window["google_chart_wrapper"];
wrapper.setOptions({
colors: ['#e0440e', '#e6693e', '#ec8f6e', '#f3b49f', '#f6c7b6']
});
wrapper.draw();
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<button onclick="nuModifyChart()">Modify Chart</button>
<div id="google_chart" data-nu-tab="8" data-nu-form="" class="nuHtml" data-nu-access="0" style="top: 38px; width: 450px; height: 192px; position: absolute; visibility: visible;"></div>
【问题讨论】:
标签: javascript html google-visualization