Googleの視覚化を使用してセルの値を表示する方法

Googleスプレッドシートをリンクして、スプレッドシートの行インデックスと列インデックスを指すHTMLの値を表示しています。括弧内の値：Googleの視覚化を使用してセルの値を表示する方法

Abolenkin、アンドレイ（0,2）

それは動作しますが、編集後に、対応のGoogleスプレッドシートに値が間違っていたり、空にスワップされた細胞を新しい行の追加、並べ替え細胞：

Abolenkin、アンドレイ（0,0）

質問が適切にポイントと値を修正する方法ですリンクされた細胞の？それぞれ

a spreadsheetを見て、スプレッドシートがソートされている場合

// https://google,developers.appspot.com/chart/interactive/docs/spreadsheets#gid 
 
     google.load('visualization', '1', {packages: ['corechart', 'line']}); 
 
     google.setOnLoadCallback(drawChart); 
 

 
     function drawChart() { 
 
     var spreadsheetUrl = "https://docs.google.com/spreadsheets/d/1tTfV1DwfbipOvCMGMhekNIDRVDROwhrvofjA5YE2JHY/edit#gid=0range=A"; 
 
     var query = new google.visualization.Query(spreadsheetUrl); 
 
     query.send(handleQueryResponse); 
 
     } 
 

 
     function handleQueryResponse(response) { 
 
     var dataTable = response.getDataTable(); 
 
     // https://developers.google.com/chart/interactive/docs/reference?hl=en#methods 
 
     // getValue(rowIndex, columnIndex) 
 
     
 
     document.getElementById("Abolenkin").innerHTML = dataTable.getFormattedValue(0, 0); 
 
     document.getElementById("Akhmadullina").innerHTML = dataTable.getFormattedValue(1, 0); 
 
     var date = (new Date().getFullYear()).toString(); 
 
     document.getElementById("year").innerHTML = date; 
 
     }

/* Indexmod CSS */ 
 

 

 
/* Лого */ 
 

 
.header { 
 
padding:0px; 
 
margin:30; 
 
} 
 

 
/* Страница */ 
 

 
.content { 
 
\t padding: 20px; 
 
\t margin: auto; 
 
\t font: 20px Georgia, serif; 
 
\t line-height: 27px; 
 
} 
 

 
h1 { 
 
font-size:70px; 
 
font-family: "Helvetica Neue", Arial, sans-serif; 
 
font-weight:100; 
 
-webkit-font-smoothing:antialiased; 
 
} 
 

 
li { 
 
\t list-style: none; 
 
\t list-style-type:none 
 
} 
 

 
a:link {color:black; text-decoration:none} 
 
a:visited {color:black; text-decoration:none} 
 
a:hover {color:black; text-decoration:underline} 
 
a:active {color:black; text-decoration:none} 
 

 
/* Подвал */ 
 

 
.footer { 
 
\t margin: auto; 
 
} 
 

 

 
#year { 
 

 
    vertical-align: super; 
 
    font-family: Georgia; 
 
    font-size: 12px; 
 
    color: black; 
 

 
} 
 

 
.what { 
 

 
    vertical-align: super; 
 
    font-family: Georgia; 
 
    font-size: 12px; 
 
    color: black; 
 
    
 
} 
 

 
.name { 
 

 
    font-weight: bold; 
 
    
 
}

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
\t <meta charset="utf-8" /> 
 
\t <!--[if lt IE 9]><script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.min.js"></script><![endif]--> 
 
\t 
 
\t <script type="text/javascript" src="https://www.google.com/jsapi"></script> 
 
    <script src="code.js"></script> 
 

 
</head> 
 
<body> 
 

 
<link href="style.css" rel="stylesheet"> 
 
<main class="content"> 
 

 
\t  
 
\t   <p id="Abolenkin-Andrei"> <span class=name>Abolenkin, Andrei</span> (<span id="Abolenkin"></span><a class=what href="http://www.indexmod.info/indexmod" title="Based on the Indexmod algorithm. Click for more info.">?</a>), Andrei Abolenkin; A.K.A Nekto Abolenkin; Rus. Андрей Аболенкин; Некто Аболенкин; born 1972, Moscow, is a Russian style and fashion expert, consultant and promoter. <a href="http://sites.google.com/site/indexmodencyclopedia/abolenkin-andrei"> Login to edit entire article indexmod.info/abolenkin-andrei</a></p> 
 
    
 
    <p id="Akhmadullina-Alena"> <span class=name>Akhmadullina, Alena</span> (<span id="Akhmadullina"></span><a class=what href="http://www.indexmod.info/indexmod" title="Based on the Indexmod algorithm. Click for more info.">?</a>), Rus. Алёна Ахмадуллина, born 1978, Sosnovy Bor, Leningrad Oblast, is a Russian fashion designer, founder of the brand Alena Akhmadullina, participant of various Russian and international competitions in the field of fashion, мember of “Snob” from April 2009.</p> 
 

 
</main> 
 

 
</body> 
 
</html>

出典

2016-09-08 Andrei Deinichenko

以下のコードは、その後、必要な値は、行0と1である保証することはできませんしてください

dataTable.getFormattedValue(0, 0) //<-- (row, column)

正しい値が見つかるようにするには、ca n個のDataTable

にgetFilteredRowsメソッドを使用する表のチャートは

google.load('visualization', '1', {packages: ['corechart', 'table']}); 
 
google.setOnLoadCallback(drawChart); 
 

 
function drawChart() { 
 
    var spreadsheetUrl = "https://docs.google.com/spreadsheets/d/1tTfV1DwfbipOvCMGMhekNIDRVDROwhrvofjA5YE2JHY/edit#gid=0range=A"; 
 
    var query = new google.visualization.Query(spreadsheetUrl); 
 
    query.send(handleQueryResponse); 
 
} 
 

 
function handleQueryResponse(response) { 
 
    var dataTable = response.getDataTable(); 
 

 
    //var container = document.getElementById("chart_div"); 
 
    //var chart = new google.visualization.Table(container); 
 
    //chart.draw(dataTable); 
 

 
    document.getElementById("Abolenkin").innerHTML = findValue("Abolenkin"); 
 
    document.getElementById("Akhmadullina").innerHTML = findValue("Akhmadullina"); 
 

 
    function findValue(surname) { 
 
    var value = ''; 
 

 
    var rowsFound = dataTable.getFilteredRows([{ 
 
     column: 7, 
 
     value: surname 
 
    }]); 
 

 
    if (rowsFound.length > 0) { 
 
     value = dataTable.getFormattedValue(rowsFound[0], 0); 
 
    } 
 

 
    return value; 
 
    } 
 
}

div { 
 
    padding: 8px; 
 
}

<script src="https://www.google.com/jsapi"></script> 
 

 
<div> 
 
    Abolenkin: <span id="Abolenkin"></span> 
 
</div> 
 

 
<div> 
 
    Akhmadullina: <span id="Akhmadullina"></span> 
 
</div> 
 

 
<div id="chart_div"></div>

出典

2016-09-09 12:19:00 WhiteHat

はありがとうござい問題を視覚化するために使用され
、次の作業スニペットでfindValue関数を参照してください！機能を削除すると機能が停止します。 htmlから表を隠す方法を明確にしてください。 –

乾杯！白い帽子 –

Googleの視覚化を使用してセルの値を表示する方法

答えて

関連する問題