背景
我在Fusion Tables中创建了一个代理联系人数据库,附带几何图形以突出显示其区域。我能够在Google地图上渲染这些地区,并在点击任何地区时创建信息窗口。 决定使用自动完成API进行地址搜索,它可以正常工作,因为它缩放到位置并放置标记。
问题:
鉴于我能够检索此标记的经度和纬度,我如何能够从不同的列中获取值以添加到我的infowindow HTML。
以下是我遇到问题的代码部分:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Net;
using System.Net.Sockets;
namespace ConsoleApp20
{
class Program
{
static void Main(string[] args)
{
UdpClient client = new UdpClient();
client.Connect(new IPEndPoint(IPAddress.Parse("192.168.1.131"), 5555));
cli();
sv();
void cli()
{
Console.Write(">");
string input = Console.ReadLine();
if (input != null)
{
byte[] bytesent = Encoding.ASCII.GetBytes(input);
client.Send(bytesent, bytesent.Length);
Console.WriteLine("Successfully message sent");
client.Close();
Console.ReadLine();
}
}
void sv()
{
IPEndPoint remoteip = new IPEndPoint(IPAddress.Any, 5555);
byte[] receviedbyte = client.Receive(ref remoteip);
if (remoteip != null)
{
string message = Encoding.ASCII.GetString(receviedbyte);
Console.WriteLine(message);
}
else
{
Console.WriteLine("empty mesaage has been received");
}
Console.ReadLine();
}
}
}
}
非常感谢任何帮助。
答案 0 :(得分:0)
可能最好的方法是使用Google Visualization API,特别是DataTable
对象来获取带有空间查询的Fusion Table数据。
这是simple sample JSbin。在这里,我展示了一个简单的FusionTableLayer
代表加拿大省份suppressInfoWindows: true
和clickable: false
(因此该图层仅用于显示目的)。还有一个Autocomplete
小部件,仅限加拿大的地方。输入地址后,将使用Marker
中的信息创建Geocoder
。最重要的是,使用半径为50米的小圆圈和LatLng
的中心Geocoder
对下表菜单中的地址进行空间查询。然后,从表查询返回的数据(包含小圆圈的省的名称和缩写)将添加到InfoWindow
上锚定的Marker
。相关代码:
var map = new google.maps.Map(document.getElementById('map'), {
center: new google.maps.LatLng(55.038487,-99.517295),
zoom: 4
});
var autocomplete = new google.maps.places.Autocomplete(document.getElementById('address'),{
placeIdOnly: true
});
autocomplete.setComponentRestrictions({'country': ['ca']});
var geocoder = new google.maps.Geocoder();
var infoWindow = new google.maps.InfoWindow();
var marker = new google.maps.Marker({
map: map
});
autocomplete.addListener('place_changed', function(event) {
infoWindow.close();
var place = autocomplete.getPlace();
if (!place.place_id) {
return;
}
geocoder.geocode({'placeId': place.place_id}, function(results, status) {
if (status !== 'OK') {
window.alert('Geocoder failed due to: ' + status);
return;
}
marker.setPlace({
placeId: place.place_id,
location: results[0].geometry.location
});
marker.setVisible(true);
var content = "<b>Address:</b> " + results[0].formatted_address + "<br>";
var query = "SELECT 'Place' as place, 'Description' as description " +
"FROM 1GK_AefKlsiBzyufbFDuRqvF9RZTdJOUXqnIiCaO9 " +
"WHERE ST_INTERSECTS(geometry, " +
"CIRCLE(LATLNG(" + results[0].geometry.location.toUrlValue() + "), 50))";
var queryText = encodeURIComponent(query);
var gvizQuery = new google.visualization.Query(
'http://www.google.com/fusiontables/gvizdata?tq=' + queryText);
gvizQuery.send(function(response) {
var table = response.getDataTable();
content += "<b>Name (Fusion Table):</b> " + table.getValue(0,0) +
"<br/><b>Desc (Fusion Table):</b> " + table.getValue(0,1);
infoWindow.setContent(content);
infoWindow.open(map, marker);
});
});
});