Premetto che non ho molta dimestichezza con jscript. Ecco il mio problema.
In un database (mdb access) ho un elenco di negozi e per ogni negozio ho alcune informazioni.
Ho una pagina in aso dove apro il database e all'interno ho uno script java che mi crea una mappa con la posizione dei negozzi sul territorio.
Lo script funziona se metto un elenco ( a mano) dei negozi
Io vorrei fare in modo che l'elenco sia implementato dal database (set di record).
Allo stato attuale viene preso il primo negozio, come faccio a creare una situazione di tipo
do while rs.EOF
(record database)
rs.movenex
loop
??????
Posto il codice funzionante (ma mi da solo il priomo record del database:
<%
Set rs=application("elenco").execute("SELECT [id], [foto], [nome], [indirizzo], [localita], [nazione], [urlhomepage], [latitudine], [longitudine] FROM [database] ")
%>
<script type="text/javascript">
var mapDiv,
map,
infobox;
jQuery(document).ready(function($) {
mapDiv = $("#directory-main-bar");
mapDiv.height(500).gmap3({
map: {
options: {
"draggable": true
,"mapTypeControl": true
,"mapTypeId": google.maps.MapTypeId.ROADMAP
,"scrollwheel": false
,"panControl": true
,"rotateControl": false
,"scaleControl": true
,"streetViewControl": true
,"zoomControl": true
}
},
marker: {
values: [
// inizio riga
var x = -1
{
latLng: [<%=rs(7)%>,<%=rs(8)%>],
options: {
icon: "directory/kord.png",
shadow: "directory/icon-shadow.png",
},
data: '<div class="marker-holder"><div class="marker-content with-image">[img]/cont_photo/foto/gruppi/<%=rs(1)%>.jpg[/img]<div class="map-item-info"><div class="title">'+"<%=rs(2)%>"+'</div><div class="address">'+"<%=rs(3)%>, <%=rs(4)%>, <%=rs(5)%>"+'</div>VIEW MORE</div><div class="arrow"></div><div class="close"></div></div></div></div>'
}
// fine riga
],
options:{
draggable: false
},
cluster:{
radius: 20,
// This style will be used for clusters with more than 0 markers
0: {
content: "<div class='cluster cluster-1'>CLUSTER_COUNT</div>",
width: 90,
height: 80
},
// This style will be used for clusters with more than 20 markers
20: {
content: "<div class='cluster cluster-2'>CLUSTER_COUNT</div>",
width: 90,
height: 80
},
// This style will be used for clusters with more than 50 markers
50: {
content: "<div class='cluster cluster-3'>CLUSTER_COUNT</div>",
width: 90,
height: 80
},
events: {
click: function(cluster) {
map.panTo(cluster.main.getPosition());
map.setZoom(map.getZoom() + 2);
}
}
},
events: {
click: function(marker, event, context){
map.panTo(marker.getPosition());
infobox.setContent(context.data);
infobox.open(map,marker);
// if map is small
var iWidth = 260;
var iHeight = 300;
if((mapDiv.width() / 2) < iWidth ){
var offsetX = iWidth - (mapDiv.width() / 2);
map.panBy(offsetX,0);
}
if((mapDiv.height() / 2) < iHeight ){
var offsetY = -(iHeight - (mapDiv.height() / 2));
map.panBy(0,offsetY);
}
}
}
}
},"autofit");
map = mapDiv.gmap3("get");
infobox = new InfoBox({
pixelOffset: new google.maps.Size(-50, -65),
closeBoxURL: '',
enableEventPropagation: true
});
mapDiv.delegate('.infoBox .close','click',function () {
infobox.close();
});
if(isTouchDevice()){
map.setOptions({ draggable : false });
var draggableClass = 'inactive';
var draggableTitle = 'Activate map';
var draggableButton = $('<div class="draggable-toggle-button '+draggableClass+'">'+draggableTitle+'</div>').appendTo(mapDiv);
draggableButton.click(function () {
if($(this).hasClass('active')){
$(this).removeClass('active').addClass('inactive') .text('Activate map');
map.setOptions({ draggable : false });
} else {
$(this).removeClass('inactive').addClass('active') .text('Deactivate map');
map.setOptions({ draggable : true });
}
});
}
});
</script>
grazie a chi mi può aiutare...
Rispondi quotando
