一直在拉我的头发一段时间:尝试使用json从我的数据库中获取lat/lng值,然后使用这些值将标记输出到谷歌地图上.目前,地图显示时没有标记,控制台中没有错误.任何帮助将不胜感激!
<script type="text/javascript">
var map = null;
function addMarker(lat,lng) {
marker = new google.maps.Marker({
position: new google.maps.LatLng(lat,lng),
map: map,
});
}
function initialize() {
var mapOptions = {
center: {lat: 54.872128, lng: - 6.284874},
zoom: 13
};
map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
$(document).ready(function(){
$.getJSON('MarkersController.php', function(data){
var locations = JSON.parse(data);
for(var i =0; i<locations.length; i++){
addMarker(locations['lat'], locations['lng']);
}
});
});
}
google.maps.event.addDomListener(window, 'load', initialize);
Run Code Online (Sandbox Code Playgroud)
用于从mysql检索的php脚本:
<?php
include('DB_INFO.php');
// Opens a connection to a MySQL server.
$connection = mysqli_connect($server, $username, $password);
if …Run Code Online (Sandbox Code Playgroud) 在我的网页上,我有一个谷歌地图,以及三个图表.当页面加载时,地图很好,但图表要么不加载,要么只加载一两个.继续收到错误TypeError:google.visualization.DataTable不是构造函数.
function load() {
//map object
var MY_MAP = new google.maps.Map(document.getElementById("map"), {
center: {lat: 54.870902, lng: -6.300565},
zoom: 14
});
//call to get and process data
downloadUrl("Map.php", processXML);
}
// Load the Visualization API and the piechart package.
google.load('visualization', '1.0', {'packages':['corechart']});
// Set a callback to run when the Google Visualization API is loaded.
google.setOnLoadCallback(drawAltitudeChart());
google.setOnLoadCallback(drawDisplacementChart());
google.setOnLoadCallback(drawDistanceChart());
function drawAltitudeChart(){
//console.log('hello');
var graph = [];
downloadUrl("Map.php", function (data){
var xml = data.responseXML;
var markers = xml.documentElement.getElementsByTagName("marker");
var dataTable = new google.visualization.DataTable(); …Run Code Online (Sandbox Code Playgroud) 在我的数据库中,我有lat/lng值,我正在尝试在谷歌地图上显示标记.(我的地图出现了,但是无法让标记出现!).
// Selects all the rows in the tester table.
$query = 'SELECT * FROM tester WHERE 1';
$result = mysql_query($query);
if (!$result)
{
die('Invalid query: ' . mysql_error());
}
while ($row = mysql_fetch_assoc($result))
{?>
var marker = new google.maps.Marker({
position: <?php $row['lat']?>, <?php $row['lng']?> ,
map: map,
title:"Hello World!"
});
}
Run Code Online (Sandbox Code Playgroud)
任何帮助都会非常感谢!
我目前在我的网页上显示一个静态谷歌图表,并想知道是否有定期更新它的方法?即每20秒加一个点?
我似乎无法找到任何相关信息.请看下面的代码
function drawAltitudeChart(){
var graph = [];
downloadUrl("Map.php", function (data){
var xml = data.responseXML;
var markers = xml.documentElement.getElementsByTagName("marker");
var dataTable = new google.visualization.DataTable();
var options = {title:'Altitude (m above sea level)',
curveType:'function',
legend:{position:'bottom'},
is3d:true
};
var chart;
for(var i = 0; i<markers.length; i++){
graph[i] = ['', parseInt(markers[i].getAttribute("alt"))];
}
dataTable.addColumn('string', 'id');
dataTable.addColumn('number', 'Altitude');
dataTable.addRows(graph);
chart = new google.visualization.LineChart(document.getElementById('curve_chart'));
chart.draw(dataTable, options);
});
}
Run Code Online (Sandbox Code Playgroud) 为MarkersController.php做了一个返回json的路由,但是当我导航到路由时,我收到以下错误:
未声明HTML文档的字符编码.如果文档包含US-ASCII范围之外的字符,则文档将在某些浏览器配置中使用乱码文本进行渲染.必须在文档或传输协议中声明页面的字符编码.
我的路线如下:
$app->get('/markers/?', function () use ($app) {
$controller = new UF\MarkersController($app);
return $controller->getMarkersJSON();
});
Run Code Online (Sandbox Code Playgroud)
MarkersController.php
<!DOCTYPE html>
<html lang="en">
<head>
{% include 'components/head.html' %}
</head>
<body>
<?php
include('DB_INFO.php');
function getMarkersJSON(){
// Opens a connection to a MySQL server.
$connection = mysqli_connect($server, $username, $password);
if (!$connection) {
die('Not connected : ' . mysqli_error());}
// Sets the active MySQL database.
$db_selected = mysqli_select_db($database, $connection);
if (!$db_selected) {
die('Can\'t use db : ' . mysqli_error());}
// Selects all the rows in …Run Code Online (Sandbox Code Playgroud) 使用mysql/php/js尝试显示曲线图 - 当前图表正在显示,但它是空白的.
google.load('visualization', '1.0', {'packages':['corechart']});
google.setOnLoadCallback(drawChart);
function drawChart() {
var graph = Array();
downloadUrl("map.php", function (data){
var xml = data.responseXML;
var markers = xml.documentElement.getElementsByTagName("marker");
for(var i =0; i<markers.length; i++){
graph.push([i], [markers[i].getAttribute["alt"]]);
}
});
var data = google.visualization.arrayToDataTable(graph);
data.addColumn('number', 'id');
data.addColumn('number', 'Altitude');
var options = {
title: 'Altitude',
curveType: 'function',
legend: { position: 'bottom' }
};
var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));
chart.draw(data, options);
}
Run Code Online (Sandbox Code Playgroud)
downloadURL是一种从我的数据库中检索信息的方法 - 寻找高度并简单地绘制它.这个方法绝对可行,因为我也用它来为谷歌地图添加标记......