Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Boa tarde
Pessoal estou criando um gráfico em canvas a partir de dados de um .gpx.
Criando toda estrutura do Canvas em <script>
No entanto, não está dando muito certo
Alguém tem uma ideia do porquê?
<!DOCTYPE html>
<html>
<head>
<script src="http://maps.googleapis.com/maps/api/js"></script>
</head>
<body>
<script>
function loadXMLDoc() {
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
myFunction(xmlhttp);
}
}
xmlhttp.open("GET", "RK_gpx _2014-11-26_1731.xml", true);
xmlhttp.send();
}
function myFunction(xml) {
var i;
var xyz = xml.responseXML;
var x = xyz.getElementsByTagName("ele");
for (i = 0; i <x.length-1; i++) {
var line = "<line x1='"+i+"' y1='";
line+=x[i].getElementsByTagName("ele")[0].childNodes[0].nodeValue+"' x2='"+i+1+"' y2='";
line+=x[i+1].getElementsByTagName("ele")[0].childNodes[0].nodeValue+"' style='stroke:rgb(255,0,0);stroke-width:2' />";
document.getElementById("demo").innerHTML = line;
}
// <line id="demo" x1="i" y1="0" x2="1" y2="x" style="stroke:rgb(255,0,0);stroke-width:2" />
}
</script>
<svg id="demo" height="800" width="600">
</svg>
</body>
</html>É porque quando coloco rodar, não aparece nada na tela...
Checou se os dados estão retornando corretamente quando você faz a requisição?
Abra o console do navegador e veja se há algum erro.
Estão retornando sim..
Ao invés de:
document.getElementById("demo").innerHTML = line;
Não seria:
document.getElementById("demo").innerHTML += line;
?
Da primeira forma, o conteúdo de "demo" será removido e substituído pelo último valor de "line".
Acho que você quer manter todos, não?!
Se não for isso, tente explicar melhor esse "não está dando muito certo".