Создать отчет графической диаграммы

В основном я создаю приложение, которое отслеживает расположение устройств. И у меня есть таблица HTML, которая показывает детали.Создать отчет графической диаграммы

------- -------- ------- ----------- ------- 
slno  device  type  location  time 
------- -------- ------- ----------- -------- 
    1  iphone  apple  cafeteria  10/3/15 10am 
    2  s5   samsung 1st floor  10/3/15 10.12am 
    3  OneX  HTC  2nd floor  10/3/15 10am 
    4  iphone  apple  cafeteria  10/3/15 10.01am 
    .   ..   ..   ..    ..

Мои данные динамичны и более (я мог бы иметь 200 записей в моей таблице на 5 минут), и я ищу с Dyanamic графических плагин диаграммы из PHP или из JQuery, который точно поставить свои данные в представление диаграммы.

Я смотрел Highcharts и arbor.js. и не смог реализовать arbor.js для моих динамических данных.

Мне нужны предложения, ссылки, которые, как я подхожу к моим табличным данным для создания моей графической карты?

источник

2015-03-10 Matarishvan

вы должны, вероятно, увидеть эту ссылку http://stackoverflow.com/questions/7034/graph-visualization -library-in-javascript – Arun

Highcharts lib имеет [учебник] (http://www.highcharts.com/docs/working-with-data/data-intro) для работы с данными. –

Я думаю, chart.js поможет вам. попробуйте

это простой динамической диаграммы обновления от https://gist.github.com/skhisma/5689383

Demo для него

<!DOCTYPE html> 
<html> 
<head> 
<title>Chart.js Redraw Example</title> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script> 
<script type="text/javascript" charset="utf-8" src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/1.0.2/Chart.min.js 
"></script> 
<script type="text/javascript" charset="utf-8"> 
window.chartOptions = { 
segmentShowStroke: false, 
percentageInnerCutout: 75, 
animation: false 
}; 
var chartUpdate = function(value) { 
console.log("Updating Chart: ", value); 
// Replace the chart canvas element 
$('#chart').replaceWith('<canvas id="chart" width="300" height="300"></canvas>'); 
// Draw the chart 
var ctx = $('#chart').get(0).getContext("2d"); 
new Chart(ctx).Doughnut([ 
{ value: value, 
color: '#4FD134' }, 
{ value: 100-value, 
color: '#DDDDDD' }], 
window.chartOptions); 
// Schedule next chart update tick 
setTimeout (function() { chartUpdate(value - 1); }, 1000); 
} 
$(document).ready(function() { 
setTimeout (function() { chartUpdate(99); }, 1000); 
}) 
</script> 
</head> 
<body> 
<canvas id="chart" width="300" height="300"></canvas> 
</body>

источник

2015-03-10 06:38:29

Это предложение, оно должно быть в комментарии, это не может считаться ответом. –

@MokshShah: Проблема в том, что вопрос вызывает предложения. Я отметил это как таковое. –

Даже в этом случае вы должны добавить пример кода, относящийся к вопросу OP. –

Создать отчет графической диаграммы

ответ

Смежные вопросы