Leitura de um banco de dados de locais

Question

Eu tenho este cenário, preenchimento pode alguém as lacunas para mim? É como este:

banco de dados campos Mapas de mesa:

MAP_ID, coordenadas, MarkerTitle, MarkerField.

Código Behind:

Dim myTableAdapter As New myDatasetTableAdapters.tblMapsTableAdapters
Dim myTable As myDataset.tblMapsDataTable = myTableAdapter.GetAllMaps()

Agora, eu estou atribuindo um valor de cada vez para ser capaz de mostrar um googleMap na minha página, simplesmente por ter Amigo Variáveis ??e em codebehind que recebe seus valores em PageLoad e eu declarou variáveis ??com o mesmo nome no meu script que mostra os mapas, é como:

Código Behind:

Friend coordinates As String
Friend zoom As String
Friend maptitle As String
Friend text As String

Script:

<script type="text/javascript">
  function load() {
    var map = new GMap2(document.getElementById("map"));
    var marker1 = new GMarker(new GLatLng(<%=coordinates%>));
    var html1="<%=maptitle%><br/>" + "<%=text%>";
    map.setCenter(new GLatLng(<%=coordinates%>), 5);
    map.setMapType(G_HYBRID_MAP);
    map.addOverlay(marker1);

    map.addControl(new GLargeMapControl());
    map.addControl(new GScaleControl());
    map.addControl(new GMapTypeControl());
    marker.openInfoWindowHtml(html1);
  }
</script>

Como posso ir do procedimento acima para algo como: passar um todo tableOfMaps ao JavaScript ou ler esses dados a sua (informações do banco de dados recuperação de dentro lado do JavaScript) e, em seguida, repetindo assim:

For Each map In MapsTable
{
var marker1 = new GMarker(new GLatLng(<%=coordinates%>));
var html1="<%=maptitle%><br/>" + "<%=text%>";
map.addOverlay(marker1);
marker.openInfoWindowHtml(html1);
}

Eu sei que isso é pedir muito, por isso ajuda será muito apreciada ...

Answer 1

Eu vou usar jQuery para simplificar as coisas, a esperança de que é OK ...

Execute as bases de dados look-ups no lado do servidor e dados emitem para o HTML. Você deve estar olhando para produzir algo como isto:

<div id="maps-table">
  <div class="map-entry">
    <span class="map-title">Title 1</span>
    <span class="map-text">Text 1</span>
    <span class="map-coordinates">Coordinates 1</span>
  </div>
  <div class="map-entry">
    <span class="map-title">Title 2</span>
    <span class="map-text">Text 2</span>
    <span class="map-coordinates">Coordinates 2</span>
  </div>
  ...
</div>

Se você estiver usando algo como ASP.NET você pode usar um asp:. Repeater

Uma vez que você tem os dados prestados em seu HTML, você pode consultar e iterar sobre ele:

$('#maps-table .map-entry').each(function() {

  var title = $(this).find('.map-title').text();
  var text = $(this).find('.map-text').text();
  var coordinates = $(this).find('.map-coordinates').text();

  // Add map markers here, eg:

  var marker = new GMarker(new GLatLng(coordinates));
  var html = title + "<br/>" + text;

  map.addOverlay(marker);
  marker.openInfoWindowHtml(html);

});