-1
Ich habe eine Karte, die von Koordinaten gezeichnet wird. Es funktionierte vor 3 Tagen, aber jetzt wird es nicht angezeigt.Google-Karte nicht mehr anzeigen
Code: google.load ("Visualisierung", "1", {Pakete: [ "corechart"]});
Fehler:
jsapi:22 A Parser-blocking, cross-origin script, https://www.google.com/uds/?file=visualization&v=1&packages=corechart , is invoked via document.write. This may be blocked by the browser if the device has poor network connectivity.google.loader.f @ jsapi:22 2jsapi:22 A Parser-blocking, cross-origin script, https://www.google.com/uds/api/visualization/1.0/1195ca6324d5ce101c2f520f3c62c843/format+pt_PT,default+pt_PT,ui+pt_PT,corechart+pt_PT.I.js , is invoked via document.write. This may be blocked by the browser if the device has poor network connectivity.
ich zu ändern tryed zu:
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
google.charts.load('current', {'packages':['corechart', 'map']});
google.charts.setOnLoadCallback(CarregaMapa("map-geral","eda",continente,7,-1,"#FFF",1000,600));
und ich bekomme die Fehlermeldung:
loader.js:152 Uncaught TypeError: a.shift(...) is not a function(…)
Update:
ich
ändern<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
google.charts.load('current', {'packages':['corechart', 'map']});
MapaConcelhos.map = new google.visualization.Map(document.getElementById(mapa), {
scrollwheel: false,
draggable: isDraggable,
disableDoubleClickZoom: true,
disableDefaultUI: true,
center: local,
mapTypeId: "",
backgroundColor: bk,
zoom: zoomlocal
});
aber ich habe ein Polygon zu der Karte hinzuzufügen:
var concelho = new google.maps.Polygon({
paths: coords,
idc: idconcelho,
strokeColor: "black",
strokeOpacity: 0.3,
strokeWeight: 1,
fillColor: item.Cor ? item.Cor : "white",
fillOpacity: 0.8,
html: contentString
});
concelho.setMap(MapaConcelhos.map);
so ist der Fehler:
setMap: not an instance of Map
Ist es möglich, Polygon zu einer Visualisierung hinzufügen Karte?
Warum kann ich den alten Code nicht verwenden? Warum hat jsapi Warnungen und die Karte und die Polygone werden nicht mehr gezeichnet?
Alter Code:
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
google.load("visualization", "1", {packages:["corechart"]})
var MapaConcelhos = CarregaMapa("map-geral","eda",continente,7,-1,"#FFF",1000,600);
var mapbounds = new google.maps.LatLngBounds();
var centromapa = new google.maps.LatLng();
var isDraggable = !('ontouchstart' in document.documentElement);
var longpress = false;
function CarregaMapa(mapa,mapatipo,local,zoomlocal,idd, bk,w,h) {
var MapaConcelhos = {
concelhos: [],
addlegenda: function(item) {
var leg = {
ordem: item.Legenda_key,
cor: item.Cor,
label: item.Label
}
Array.prototype.inArray = function(comparer) {
for(var i=0; i < this.length; i++) {
if(comparer(this[i])) return true;
}
return false;
};
Array.prototype.sortOn = function(key){
this.sort(function(a, b){
if(a[key] < b[key]){
return -1;
}else if(a[key] > b[key]){
return 1;
}
return 0;
});
}
Array.prototype.pushIfNotExist = function(element, comparer) {
if (!this.inArray(comparer)) {
Mapalegenda.push(element);
Mapalegenda.sortOn("ordem")
var legenda="<p><b>Legenda:</b></p>";
for (var i=0; i<Mapalegenda.length; i++) {
legenda = legenda +'<div id="map-legenda-linha"><div id="map-legenda-cor" style="background: ' + Mapalegenda[i].cor + ';"></div>' + Mapalegenda[i].label + '</div>';
}
document.getElementById("map-legenda").innerHTML = legenda;
}
};
Mapalegenda.pushIfNotExist(leg, function(e) {
return e.cor === leg.cor && e.label === leg.label;
});
},
addConcelho: function(item) {
//Set concelho coordenadas
var coords = [];
var coord = item.Coordenadas.split("|");
for (var i = 0; i < coord.length; i++) {
var latlng = coord[i].split(",");
coords.push(new google.maps.LatLng(latlng[1], latlng[0]));
}
var contentString="<b>"+item.Nome+"</b>"+item.Descricao;
//Create polygon
var idconcelho=item.Id;
var concelho = new google.maps.Polygon({
paths: coords,
idc: idconcelho,
strokeColor: "black",
strokeOpacity: 0.3,
strokeWeight: 1,
fillColor: item.Cor ? item.Cor : "white",
fillOpacity: 0.8,
html: contentString
});
MapaConcelhos.concelhos.push(concelho);
concelho.setMap(MapaConcelhos.map);
var bounds = new google.maps.LatLngBounds();
for (var i=0; i< coords.length; i++) {
bounds.extend(coords[i]);
mapbounds.extend(coords[i]);
}
var centroconcelho = bounds.getCenter();
var timer = null;
if (isDraggable)
{
google.maps.event.addListener(concelho,"click",function(){
showConcelho(concelho.idc);});
}
else
{
google.maps.event.addListener(concelho, 'mousedown', function(event){
start = new Date().getTime();
});
google.maps.event.addListener(concelho, 'mouseup', function(){
end = new Date().getTime();
longpress = (end - start < 300) ? false : true;
if (longpress) showConcelho(concelho.idc);
});
}//else
MapaConcelhos.addlegenda(item);
if (item.Ultimo=="1")
{
MapaConcelhos.map.fitBounds(mapbounds);
MapaConcelhos.map.setCenter(local);
}
function isInfoWindowOpen(infoWindow){
var map = infoWindow.getMap();
return (map !== null && typeof map !== "undefined");
}
var minZoom=8;
if (idd==41 || idd==-1) minZoom=7;
google.maps.event.addListenerOnce(MapaConcelhos.map, 'bounds_changed', function(event) {
if (this.getZoom() < minZoom) {
this.setZoom(minZoom);
MapaConcelhos.map.setCenter(local);
}
});
function showArrays(event) {
var vertices = this.getPath();
var contentString =this.html;
infoWindow.setContent(contentString);
infoWindow.setPosition(event.latLng);
infoWindow.open(MapaConcelhos.map);
}
function showConcelho(idc) {
$.fancybox({
href : "/ficha.php?id="+idc,
width : w,
height : h,
fitToView : true,
autoSize : false,
type: "iframe",
padding: 0,
openEffect : "elastic",
openSpeed : 150,
aspectRatio : true,
closeEffect : "elastic",
closeSpeed : 150,
closeClick : true,
scrolling : "auto",
preload : true
});
}
},
map: undefined,
mapContainer: document.getElementById(mapa),
initialize: function() {
google.maps.visualRefresh = true;
MapaConcelhos.map = new google.maps.Map(document.getElementById(mapa), {
scrollwheel: false,
draggable: isDraggable,
disableDoubleClickZoom: true,
disableDefaultUI: true,
center: local,
mapTypeId: "",
backgroundColor: bk,
zoom: zoomlocal
});
}
};
var requester = {};
requester.Request = function() {
$.ajax({
url: "/scripts/concelhos.php",
type: "GET",
data: { tipo: mapatipo, distrito:idd},
contentType: "application/x-www-form-urlencoded;charset=ISO-8859-1",
dataType: "json",
}).done(function(result) {
if (result) {
$.each(result, function(index, item) {
MapaConcelhos.addConcelho(item);
});
} else {
}
}).error(function() {
});
};
MapaConcelhos.initialize();
requester.Request();
return MapaConcelhos;
} //CarregaMapa
Neuer Code:
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
google.charts.load('current', {
'callback': function() {
var MapaConcelhos = CarregaMapa("map-geral","eda",continente,7,-1,"#FFF",1000,600);
},
'packages': ['corechart', 'map']
});
var mapbounds = new google.maps.LatLngBounds();
var centromapa = new google.maps.LatLng();
var isDraggable = !('ontouchstart' in document.documentElement);
var longpress = false;
function CarregaMapa(mapa,mapatipo,local,zoomlocal,idd, bk,w,h) {
var MapaConcelhos = {
concelhos: [],
addlegenda: function(item) {
var leg = {
ordem: item.Legenda_key,
cor: item.Cor,
label: item.Label
}
Array.prototype.inArray = function(comparer) {
for(var i=0; i < this.length; i++) {
if(comparer(this[i])) return true;
}
return false;
};
Array.prototype.sortOn = function(key){
this.sort(function(a, b){
if(a[key] < b[key]){
return -1;
}else if(a[key] > b[key]){
return 1;
}
return 0;
});
}
Array.prototype.pushIfNotExist = function(element, comparer) {
if (!this.inArray(comparer)) {
Mapalegenda.push(element);
Mapalegenda.sortOn("ordem")
var legenda="<p><b>Legenda:</b></p>";
for (var i=0; i<Mapalegenda.length; i++) {
legenda = legenda +'<div id="map-legenda-linha"><div id="map-legenda-cor" style="background: ' + Mapalegenda[i].cor + ';"></div>' + Mapalegenda[i].label + '</div>';
}
document.getElementById("map-legenda").innerHTML = legenda;
}
};
Mapalegenda.pushIfNotExist(leg, function(e) {
return e.cor === leg.cor && e.label === leg.label;
});
},
addConcelho: function(item) {
//Set concelho coordenadas
var coords = [];
var coord = item.Coordenadas.split("|");
for (var i = 0; i < coord.length; i++) {
var latlng = coord[i].split(",");
coords.push(new google.maps.LatLng(latlng[1], latlng[0]));
}
var contentString="<b>"+item.Nome+"</b>"+item.Descricao;
//Create polygon
var idconcelho=item.Id;
var concelho = new google.maps.Polygon({
paths: coords,
idc: idconcelho,
strokeColor: "black",
strokeOpacity: 0.3,
strokeWeight: 1,
fillColor: item.Cor ? item.Cor : "white",
fillOpacity: 0.8,
html: contentString
});
MapaConcelhos.concelhos.push(concelho);
concelho.setMap(MapaConcelhos.map);
var bounds = new google.maps.LatLngBounds();
for (var i=0; i< coords.length; i++) {
bounds.extend(coords[i]);
mapbounds.extend(coords[i]);
}
var centroconcelho = bounds.getCenter();
var timer = null;
if (isDraggable)
{
google.maps.event.addListener(concelho,"click",function(){
showConcelho(concelho.idc);});
}
else
{
google.maps.event.addListener(concelho, 'mousedown', function(event){
start = new Date().getTime();
});
google.maps.event.addListener(concelho, 'mouseup', function(){
end = new Date().getTime();
longpress = (end - start < 300) ? false : true;
if (longpress) showConcelho(concelho.idc);
});
}//else
MapaConcelhos.addlegenda(item);
if (item.Ultimo=="1")
{
//MapaConcelhos.map.fitBounds(mapbounds);
//MapaConcelhos.map.setCenter(local);
}
function isInfoWindowOpen(infoWindow){
var map = infoWindow.getMap();
return (map !== null && typeof map !== "undefined");
}
var minZoom=8;
if (idd==41 || idd==-1) minZoom=7;
google.maps.event.addListenerOnce(MapaConcelhos.map, 'bounds_changed', function(event) {
if (this.getZoom() < minZoom) {
this.setZoom(minZoom);
MapaConcelhos.map.setCenter(local);
}
});
function showArrays(event) {
var vertices = this.getPath();
var contentString =this.html;
infoWindow.setContent(contentString);
infoWindow.setPosition(event.latLng);
infoWindow.open(MapaConcelhos.map);
}
function showConcelho(idc) {
$.fancybox({
href : "/ficha.php?id="+idc,
width : w,
height : h,
fitToView : true,
autoSize : false,
type: "iframe",
padding: 0,
openEffect : "elastic",
openSpeed : 150,
aspectRatio : true,
closeEffect : "elastic",
closeSpeed : 150,
closeClick : true,
scrolling : "auto",
preload : true
});
}
},
map: undefined,
mapContainer: document.getElementById(mapa),
initialize: function() {
google.maps.visualRefresh = true;
MapaConcelhos.map = new google.visualization.Map(document.getElementById(mapa), {
scrollwheel: false,
draggable: isDraggable,
disableDoubleClickZoom: true,
disableDefaultUI: true,
center: local,
mapTypeId: "",
backgroundColor: bk,
zoom: zoomlocal
});
}
};
var requester = {};
requester.Request = function() {
$.ajax({
url: "/scripts/concelhos.php",
type: "GET",
data: { tipo: mapatipo, distrito:idd},
contentType: "application/x-www-form-urlencoded;charset=ISO-8859-1",
dataType: "json",
}).done(function(result) {
if (result) {
$.each(result, function(index, item) {
MapaConcelhos.addConcelho(item);
});
} else {
}
}).error(function() {
});
};
MapaConcelhos.initialize();
requester.Request();
return MapaConcelhos;
} //CarregaMapa
Danke. es ruft die Funktion auf. Theres ist kein Fehler, aber es ist zeigt die Karte nicht ... Code: MapaConcelhos.map = new google.maps.Map (document.getElementById (Karte), { \t Scrollrads: false, \t ziehbar: isDraggable, \t disableDoubleClickZoom: true , \t disableDefaultUI: true, \t Zentrum: lokal, mapTypeId: "", background~~POS=TRUNC: bk, Zoom: zoomlocal }); – atmenezes
ich denke, die Optionen sollten an die 'draw'-Funktion übergeben werden, nicht den Konstruktor ->' google.maps.Map' - wenn Sie den Rest des Codes und ein Beispiel der Daten zu der Frage hinzufügen könnten , es würde helfen... – WhiteHat