0

データを視覚化するために選択するドロップダウンボックスメニューを追加しようとしています。ドロップダウンボックスがなくても視覚化は正常に機能しますが、それらを組み合わせると問題が発生します。私のコードでは、selection02を選択したときにデータを視覚化したいです。誰か助けてもらえますか？

<html>
<head>
<script language="javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>

<script type="text/javascript">

function allagi()
{
   if (document.getElementById("selection01").selected==true)
   {
      function01();
   }
   else if (document.getElementById("selection02").selected==true)
   {
      f1();
   }
   else if (document.getElementById("selection03").selected==true)
   {
      function03();
   }
   else if (document.getElementById("selection04").selected==true)
   {
      function04();
   }
}


</script>

<script type="text/javascript" src="//ajax.googleapis.com/ajax/static/modules/gviz/1.0/chart.js"> 
function f1(){
 {"dataSourceUrl":"//docs.google.com/spreadsheet/tq?key=0AihqKzH-MgAndERnaFVsYk1RLUM3S0pDSmNjcEQ4M1E&transpose=0&headers=0&range=A2%3AB13&gid=0&pub=1","options":{"vAxes":[{"useFormatFromData":true,"viewWindowMode":"pretty","viewWindow":{}},{"useFormatFromData":true,"viewWindowMode":"pretty","viewWindow":{}}],"booleanRole":"certainty","animation":{"duration":0},"useFirstColumnAsDomain":true,"hAxis":{"useFormatFromData":true,"viewWindowMode":"pretty","viewWindow":{}},"isStacked":false,"width":454,"height":285},"state":{},"chartType":"AreaChart","chartName":"\u0393\u03c1\u03ac\u03c6\u03b7\u03bc\u03b1 1"} 
 }
 </script>



</head>
<body>



<div id="wrapper">
  <div id="logo"><select onchange="allagi()">
  <option id="selection01">Selection01</option>
  <option id="selection02">Selection02</option>
  <option id="selection03">Selection03</option>
  <option id="selection04">Selection04</option>
</select></div>
  <div id="pie">






  </div>
</div>

</body>
</html>
4

2 に答える 2

0 
  <script type="text/javascript">
   function allagi() {
    if (document.getElementById("d4ropdown1").value == "s1" )
   {
    alert ("1");
   }
 else if (document.getElementById("selection02").value == "s2")
  {
   document.getElementById("VisualizationDisplay").style.display = "block";
   }
  else if (document.getElementById("selection03").value == "s3")
  {
   alert("3");
  }
  else if (document.getElementById("selection04").value == "s4")
  {
   alert("4");
  }
  }
</script>


<div id="VisualizationDisplay" style="display:none">

 <script type="text/javascript" src="https://ajax.googleapis.com/ajax/static/modules/gviz/1.0/chart.js">
 {"dataSourceUrl":"https://docs.google.com/spreadsheet/tq?key=0AihqKzH-MgAndERnaFVsYk1RLUM3S0pDSmNjcEQ4M1E&   transpose=0&headers=0&range=A2%3AB13&gid=0&pub=1","options":{"vAxes":[{"useFormatFromData":true,"viewWindowMode":"pretty","viewWindow":{}},{"useFormatFromData":true,"viewWindowMode":"pretty","viewWindow":{}}],"booleanRole":"certainty","animation":{"duration":0},"useFirstColumnAsDomain":true,"hAxis":{"useFormatFromData":true,"viewWindowMode":"pretty","viewWindow":{}},"isStacked":false,"width":454,"height":285},"state":{},"chartType":"AreaChart","chartName":"\u0393\u03c1\u03ac\u03c6\u03b7\u03bc\u03b1 1"} </script>

</div>
 <div id="logo"><select id="d4ropdown1" onchange="allagi()">
 <option id="selection01" value="s1">Selection01</option>
 <option id="selection02" value="s2">Selection02</option>
 <option id="selection03" value="s3">Selection03</option>
 <option id="selection04" value="s4">Selection04</option>
</select></div>

これは単なるハックです...それはあなたが望むように機能します...しかし、私はそれを行うためのより良い方法があるはずだと確信しています..役に立たなかったらごめんなさい...

于 2012-10-09T14:24:36.813 に答える
0

あなたが書いた JavaScript は構文的に無効だと思います。

function f1() { "string" }「string」が JSON 文字列のように見える場所を書きました。この文字列をパラメーターとして渡す関数を呼び出すコードを作成するつもりだったと思いますが、使用しているサービスの構文がわかりません。

<script type="text/javascript" src="//ajax.googleapis.com/ajax/static/modules/gviz/1.0/chart.js"> 
function f1(){
 {"dataSourceUrl":"//docs.google.com/spreadsheet/tq?key=0AihqKzH-MgAndERnaFVsYk1RLUM3S0pDSmNjcEQ4M1E&transpose=0&headers=0&range=A2%3AB13&gid=0&pub=1","options":{"vAxes":[{"useFormatFromData":true,"viewWindowMode":"pretty","viewWindow":{}},{"useFormatFromData":true,"viewWindowMode":"pretty","viewWindow":{}}],"booleanRole":"certainty","animation":{"duration":0},"useFirstColumnAsDomain":true,"hAxis":{"useFormatFromData":true,"viewWindowMode":"pretty","viewWindow":{}},"isStacked":false,"width":454,"height":285},"state":{},"chartType":"AreaChart","chartName":"\u0393\u03c1\u03ac\u03c6\u03b7\u03bc\u03b1 1"} 
 }
 </script>
于 2012-10-09T18:23:03.643 に答える