0

小さな地図があり、2 つの異なる情報カテゴリを別々に表示したいと考えています。コードに 2 つのラジオ ボタンを配置して、ユーザーがこれらのカテゴリ名のいずれかを選択できるようにしました。ユーザーがマップ上にマウスを移動すると、特定のラジオ ボタンに関連する情報が表示されます。以下のコードは最初のラジオ ボタンに対してのみ機能し、2 番目のラジオ ボタンをもう一度選択すると、最初の情報が表示されます。どうすればいいですか？その間、私のコードの構造は機能しますが、ここにすべてを書くことはできません。

これが私のコードです:情報は以下のマトリックスに保存されます:

var myCantons = [];
myCantons[0]=[name,year,population,density,year,population,density];
myCantons[1]=[x,1982,1200000,1.2,1992,300000,1.8];
myCantons[2]=[y,1982,5000000,4,1992,390000,4.6];

ラジオ ボタンは次のとおりです。

<form action="">
   <input type="radio" name="againcies" value="SP" 
     "onchange="myShowValues(myEvent)"/>
   <input type="radio" name="againcies" value="Moody"            
     "onchange="myShowValues(myEvent)"/>

機能は次のとおりです。

function myShowValues(myEvent,detaset){
  if(dataset==1){
    document.getElementById('myLegCantName').firstChild.data =  myCantons[Id][0];
    document.getElementById('year').firstChild.data = myCantons[Id][1];
    document.getElementById('myLegCantVal').firstChild.data =(myCantons[Id][2]);
    document.getElementById('myLegCantVal2').firstChild.data =(myCantons[Id][3]);
  } else {
    document.getElementById('myLegCantName').firstChild.data = myCantons[Id][0]      
    document.getElementById('myLegCantRate').firstChild.data = myCantons[Id][4];
    document.getElementById('myLegCantVal').firstChild.data =(myCantons[Id][5]);                      
    document.getElementById('myLegCantVal2').firstChild.data =(myCantons[myScrId][6]);
  }
}

マップには、次のような 1 つのグループに含まれる多数のポリゴンが含まれます。

<g id="myCantons" fill="#A0C544" stroke="#FFFFFF" onmouseover="myShowValues(evt,dataset)">

前に述べた私の問題は、最初のラジオボタンに対してのみ呼び出すことができる if 条件部分にあり、2番目のボタンの if 条件を適用することができません。何か考えはありますか? どうも

4

1 に答える 1

0

このようなことをしてみてください：

<input type="radio" name="againcies" value="SP" 
 onchange="changeDataset(1)"/>
<input type="radio" name="againcies" value="Moody"            
 onchange="changeDataset(2)"/>

と

<g id="myCantons" fill="#A0C544" stroke="#FFFFFF" onmouseover="myShowValues()">

次に、次のようなJavaScript：

var dataset = 1; // default value
function changeDataset(newval) {
   dataset = newval;
   // plus whatever else you need to do here
   // maybe myShowValues(); ???
}

function myShowValues(){
  if(dataset == 1){
     document.getElementById('myLegCantName').firstChild.data =  myCantons[Id][0];
     document.getElementById('year').firstChild.data = myCantons[Id][1];
     document.getElementById('myLegCantVal').firstChild.data =(myCantons[Id][2]);
     document.getElementById('myLegCantVal2').firstChild.data =(myCantons[Id][3]);
  } else {
     document.getElementById('myLegCantName').firstChild.data = myCantons[Id][0]      
     document.getElementById('myLegCantRate').firstChild.data = myCantons[Id][4];
     document.getElementById('myLegCantVal').firstChild.data =(myCantons[Id][5]);                      
     document.getElementById('myLegCantVal2').firstChild.data =(myCantons[myScrId][6]);
  }
}

注意すべき点がいくつかあります..これは有効な HTML ではありません:

"onchange="myShowValues(myEvent)"

引用が多すぎる...

于 2012-08-07T09:04:53.070 に答える