1
1つのhtmlページに同時に3つのジオコードを表示したい複数のジオカートを1ページに表示できますか?
(複数のシートから1つのチャートを1つのチャートで照会)
私は3入力シートの値を含む1つのHTMLファイルを有するdocument
で読み出しまし」として
、領域の変更のための入力(ラジオボタン)チャートの
及び3のdiv(カラーマップ/ colormap2/colormap3)
<!DOCTYPE html>
<html>
<head>
<title>All Map</title>
<script type='text/javascript' src='https://www.gstatic.com/charts/loader.js'></script>
\t <script type="text/javascript" src="testscript.js">
\t </script>
\t <link rel="stylesheet" href="styles.css">
<!--sheet id value
\t \t //weee sheet !-->
\t <input id="value1" value="https://docs.google.com/spreadsheets/d/14VouG7zZqHGB9CA6bxQx6CXX-TvOYkSqTmrN5DAj1Do/edit#gid=1175123524" type="hidden">
\t <!--bat sheet!-->
<input id="value2" value="https://docs.google.com/spreadsheets/d/1RsugJPtz2EdHOLaiL0SvR9bh61H-vAgn9x1QBjIJ--c/edit?usp=sharing" type="hidden" >
<!--pack sheet!-->
<input id="value3" value="https://docs.google.com/spreadsheets/d/1zPP22gUPLDqTrvASIU3OXpmeHL_9IBS2O4z75g-1BHY/edit?usp=sharing" type="hidden" >
</head>
<body>
\t
\t <div>
\t \t <input id="all" name="region" type="radio" value="all"><label for="all">All</label>
\t </div>
\t <div>
\t \t <input id="africa" name="region" type="radio" value="002"><label for="africa">Africa</label>
\t </div>
\t <div>
\t \t <input id="americas" name="region" type="radio" value="019"><label for="americas">Americas</label>
\t </div>
\t <div>
\t \t <input id="europe" name="region" type="radio" value="150"><label for="europe">Europe</label>
\t </div>
\t <div>
\t \t <input id="asia" name="region" type="radio" value="142"><label for="asia">Asia</label>
\t </div>
\t
//DIV FOR CHARTS
\t \t <div id='colormap'> </div>
<div id='colormap2'> </div>
<div id='colormap3'> </div>
</body>
</html>
、私はこの
google.charts.load('current', {packages: ['geochart']});
\t
\t function checkinput() {
\t var inputVal = document.getElementById();
\t for (var i = 0; i < inputVal; i++){
\t \t if (inputVal== "value1") {
\t \t drawRegionsMap();
\t \t }
\t \t else if (inputVal == "value2")
\t \t {
\t \t \t drawRegionsMap2();
\t \t }
\t \t else
\t \t {
\t \t drawRegionsMap3();
\t \t \t }
\t }
\t }
\t
\t google.charts.setOnLoadCallback(drawRegionsMap);
\t google.charts.setOnLoadCallback(drawRegionsMap2);
\t google.charts.setOnLoadCallback(drawRegionsMap3);
function drawRegionsMap() {
\t
\t var query = new google.visualization.Query((document.getElementById('value1').value));
\t ......................
}
function drawRegionsMap2() {
\t
\t var query = new google.visualization.Query((document.getElementById('value2').value));
\t ..................................
}
function drawRegionsMap3() {
\t
\t var query = new google.visualization.Query((document.getElementById('value3').value));
..............
、3 setonloadcallback
と3機能を得るために1 forループ機能を持っています
**しかし結果はページ上に1回につき1つのチャートしか表示されません。リフレッシュするたびに別のチャートから他のチャートに変更されますトン
が、私はあなたがここにページを見ることができます**
それは同時に同じページで、3つのグラフを表示したいclick this link
誰が助けてくださいすることができますか?
ありがとう
試したことがありますが、読み込まれたものはありません。それぞれのチャートごとに異なるシートをロードしていますか?シート値(URL)を取得する関数で何かを変更する必要がありますか?とにかく、あなたの助けに感謝します。 – Patcharapan
jsFiddle google exampleから取得したものを参照してください。私は答えとして言ったように私はフィドルを編集します。 https://jsfiddle.net/ataur63/5m8h1unn/ –
このように(Googleドライブに保存された)シート値を読み取ることはできません。 ''さらに、 'var inputVal = document.getElementById();'これは意味をなさない。 'for(var i = 0; i