+Speed chart

[vvaba]

Добрый день. Скажите пожалуйста, на сайте отображается график высот. Можно ли добавить к нему график скорости? Думаю, нужно редактировать main.js, но я не знаю как. Помогите, пожалуйста. +++ Good afternoon. Please tell me, the site displays a graph of heights. Can I add a speed graph to it? I think you need to edit main.js, but I don't know how. Please help me.

[bfabiszewski]

Should be pretty easy. I never did it because the speed values received from mobile device GPS are not reliable. On devices I tested it usually return 3.6, 7.2 and similar rounded values. And often it is just zero, useless for chart. If you want to add it you will generally have to copy altitudes creation routines. Basically altitudes are stored into global variable in parsePosition() and graph is created in displayChart(). It applies to current version but will be replaced soon by development branch where these routines are a bit different.

[vvaba]

Спасибо, bfabiszewski, за ваш ответ! В моём случае погрешность скорости не так высока, если двигаться на автомобиле или на поезде. Поэтому было бы здорово увидеть график скорости. Мне ясно, всё будет зависеть от точности самого GPS-модуля. С этим я согласен. Дело в том, что я добавил в parsePosition() скорость, взяв за основу сканирование высоты:

var speed = getNode(p, 'speed'); // may be null if (speed != null) { speed = parseInt(speed); // save speeds for chart speeds[id] = speed; }

А в displayChart() я скопировал, поменяв высоту на скорость:

function displayChart2() { if (chart) { google.visualization.events.removeAllListeners(chart); } var data = new google.visualization.DataTable(); data.addColumn('number', 'id'); data.addColumn('number', lang['speed']); for (var id in speeds) { if (speeds.hasOwnProperty(id)) { data.addRow([parseInt(id) + 1, Math.round((speeds[id] * 3.6))]); } } var options = { title: lang['speed'] + ' (' + unit_kmh + ')', hAxis: { textPosition: 'none' }, legend: { position: 'none' } }; chart = new google.visualization.LineChart(document.getElementById('chart')); chart.draw(data, options); addChartEvent(chart, data); }

И, соответственно я ссылаюсь в index.php на график высоты: <a id="speeds" href="javascript:void(0);" onclick="toggleChart2();"><?= $lang["speeds"] ?>

Но это не помогло. График строится, но иногда не правильно. К примеру, мой путь состоит из 100 точек, а график скорости отображает почему-то 500 точек. При переключении на другой график это явно проявляется. Свою редакцию main.js прилагаю. Скажите пожалуйста, где моя ошибка? +++ Thank you bfabiszewski for your reply! In my case, the speed error is not so high if moving by car or train. Therefore, it would be great to see a speed graph. It’s clear to me that everything will depend on the accuracy of the GPS module itself. I agree with that. The fact is that I added speed to parsePosition (), taking as a basis a height scan:

var speed = getNode(p, 'speed'); // may be null if (speed != null) { speed = parseInt(speed); // save speeds for chart speeds[id] = speed; }

And in displayChart () I copied, changing the height to speed:

function displayChart2() { if (chart) { google.visualization.events.removeAllListeners(chart); } var data = new google.visualization.DataTable(); data.addColumn('number', 'id'); data.addColumn('number', lang['speed']); for (var id in speeds) { if (speeds.hasOwnProperty(id)) { data.addRow([parseInt(id) + 1, Math.round((speeds[id] * 3.6))]); } } var options = { title: lang['speed'] + ' (' + unit_kmh + ')', hAxis: { textPosition: 'none' }, legend: { position: 'none' } }; chart = new google.visualization.LineChart(document.getElementById('chart')); chart.draw(data, options); addChartEvent(chart, data); }

And, accordingly, I refer in the index.php to the height graph: <a id="speeds" href="javascript:void(0);" onclick="toggleChart2();"><?= $lang["speeds"] ?>

But it did not help. The schedule is built, but sometimes not right. For example, my path consists of 100 points, and for some reason the speed graph displays 500 points. When switching to another chart, this is clearly manifested. I enclose my edition of main.js. Please tell me where is my mistake? main.zip

[bfabiszewski]

You are probably missing resetting the array. Altitudes are reset in displayTrack() function in both OpenLayers and Gmaps sections. There may also be other references to altitudes in other places. Look for altitudes string in all javascript files.

[vvaba]

Спасибо, bfabiszewski, за ваш ответ! Вы очень мне помогли. У меня всё получилось! +++ Thank you bfabiszewski for your reply! You've been very helpful. I did it!