0

トラフィック カメラのライブ ストリームを選択するドロップダウン ボックスがあるプロジェクトがあります。私はこの部分を機能させています。ただし、この選択はドロップダウン ボックスから行うため、カメラ ストリームの表示と同時にマップ イメージを表示する必要があります。これは私の問題です。

これは私がこれまでに持っているものです。私の質問は、各オプション値に2番目の画像リンクを添付して、各選択が行われると、現在のものではなく2つを並べて表示することはできますか?

どんな助けでも大歓迎です！

ありがとう

編集: この画像は、私が達成しようとしている結果を視覚的に説明しています - http://imgur.com/TKlN8i0

<iframe src="http://mapsengine.google.com/map/embed?mid=zqYRscs82GEY.kUSSEtK8gKbg" width="640" height="480"></iframe>

これは、カメラ ストリームで表示しようとしている埋め込みマップ コードの例です。

<html>
<body>

<img id="imageToSwap" src="http://deladream.com/wp-content/uploads/2010/11/1984.jpg" />

<br/><br/>

<select id="dd" onChange="swapImage()">
<option value="http://deladream.com/wp-content/uploads/2010/11/1984.jpg">None Selected</option>
<option value="http://131940.qld.gov.au/DMR.Controls/WebCams/DisplayImage.ashx?FilePath=Metropolitan/Upper_MtGravatt_Pac_Mwy_Nth.jpg&35170044">Upper Mount Gravatt - Pacific Motorway and Klumpp Road (North)</option>
<option value="http://131940.qld.gov.au/DMR.Controls/WebCams/DisplayImage.ashx?FilePath=\Metropolitan\MRMETRO-1224.jpg&78465240">Kenmore - Moggill Road - Kenmore Road (East)</option>
<option value="http://131940.qld.gov.au/DMR.Controls/WebCams/DisplayImage.ashx?FilePath=\Metropolitan\MRMETRO-1213.jpg&2039636175">Chermside - Gympie Road - Webster Road (South-East)</option>
<option value="http://131940.qld.gov.au//DMR.Controls/WebCams/DisplayImage.ashx?FilePath=\Metropolitan\MRMETRO-1214.jpg&2144911343">Woolloongabba - Pacific Motorway</option>
<option value="http://131940.qld.gov.au//DMR.Controls/WebCams/DisplayImage.ashx?FilePath=\Metropolitan\MRMETRO-1458.jpg&1568524335">Archerfield - Beaudesert Road and Granard Road (East)</option>
<option value="http://www.cctv.com/Library/dcs_tag.js">Chinese Pandas</option>
</select>

<script type="text/javascript">
function swapImage(){
    var image = document.getElementById("imageToSwap");
    var dropd = document.getElementById("dd");
    image.src = dropd.value;    
};
</script>
</body>
</html>
4

3 に答える 3

0

これを試して

function swapImage(){
    var image = document.getElementById("imageToSwap");
    var dropd = document.getElementById("dd");
    image.src = dropd.value; 

    var new_image = document.createElement("img");
    new_image .setAttribute("src") = dropd.value;
    image.parentNode.appendChild(new_image);
};
于 2013-10-08T05:54:30.953 に答える
0

new Image(); によって実行時に画像をロードします。物体

例えば：

function loadAllPreImages(){
images = new Array();
images[0]="images/resort.jpg"
images[1]="images/accomodation.jpg"
images[2]="images/weekendgetaways.jpg"
images[3]="images/domesticvacation.jpg"
images[4]="images/internationalvacation.jpg"
images[5]="images/Beauty.jpg"
images[6]="images/Food.jpg"
images[7]="images/Entertainment.jpg"
images[8]="images/Health.jpg"
images[9]="images/Services.jpg"
var i = 0;
for(i=0; i<10; i++)
{   imageelmentObj = new Image();
    images[i] = imageelmentObj.src=images[i];
}
}
loadAllPreImages();
于 2013-10-08T05:53:39.973 に答える