keeping changes for now
This commit is contained in:
@@ -21,7 +21,7 @@
|
||||
<!-- End Title Buttons-->
|
||||
</div>
|
||||
<div id="charts_body" class="widget-body">
|
||||
<%= render :partial => "layouts/dashboard/dashboard_stats"%>
|
||||
<%#= render :partial => "layouts/dashboard/dashboard_stats"%>
|
||||
</div>
|
||||
<div class="clearfix">
|
||||
</div>
|
||||
@@ -33,170 +33,32 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<script type="text/javascript">
|
||||
|
||||
function makeActive(){
|
||||
$('li[id="home"]').addClass('active');
|
||||
};
|
||||
|
||||
function pieChartHome() {
|
||||
$(function () {
|
||||
//create instance
|
||||
$('.chart1').easyPieChart({
|
||||
animate: 2000,
|
||||
barColor: '#e26666',
|
||||
trackColor: '#dddddd',
|
||||
scaleColor: '#e26666',
|
||||
size: 160,
|
||||
lineWidth: 7,
|
||||
});
|
||||
//update instance after 5 sec
|
||||
setTimeout(function () {
|
||||
$('.chart1').data('easyPieChart').update(50);
|
||||
}, 5000);
|
||||
setTimeout(function () {
|
||||
$('.chart1').data('easyPieChart').update(70);
|
||||
}, 10000);
|
||||
setTimeout(function () {
|
||||
$('.chart1').data('easyPieChart').update(30);
|
||||
}, 15000);
|
||||
setTimeout(function () {
|
||||
$('.chart1').data('easyPieChart').update(90);
|
||||
}, 19000);
|
||||
setTimeout(function () {
|
||||
$('.chart1').data('easyPieChart').update(40);
|
||||
}, 32000);
|
||||
});
|
||||
|
||||
$(function () {
|
||||
//create instance
|
||||
$('.chart2').easyPieChart({
|
||||
animate: 2000,
|
||||
barColor: '#b5799e',
|
||||
trackColor: '#dddddd',
|
||||
scaleColor: '#b5799e',
|
||||
size: 160,
|
||||
lineWidth: 7,
|
||||
});
|
||||
//update instance after 5 sec
|
||||
setTimeout(function () {
|
||||
$('.chart2').data('easyPieChart').update(90);
|
||||
}, 10000);
|
||||
setTimeout(function () {
|
||||
$('.chart2').data('easyPieChart').update(40);
|
||||
}, 18000);
|
||||
setTimeout(function () {
|
||||
$('.chart2').data('easyPieChart').update(70);
|
||||
}, 28000);
|
||||
setTimeout(function () {
|
||||
$('.chart2').data('easyPieChart').update(50);
|
||||
}, 32000);
|
||||
setTimeout(function () {
|
||||
$('.chart2').data('easyPieChart').update(80);
|
||||
}, 40000);
|
||||
});
|
||||
|
||||
$(function () {
|
||||
//create instance
|
||||
$('.chart3').easyPieChart({
|
||||
animate: 2000,
|
||||
barColor: '#579da9',
|
||||
trackColor: '#dddddd',
|
||||
scaleColor: '#579da9',
|
||||
size: 160,
|
||||
lineWidth: 7,
|
||||
});
|
||||
//update instance after 5 sec
|
||||
setTimeout(function () {
|
||||
$('.chart3').data('easyPieChart').update(20);
|
||||
}, 9000);
|
||||
setTimeout(function () {
|
||||
$('.chart3').data('easyPieChart').update(59);
|
||||
}, 20000);
|
||||
setTimeout(function () {
|
||||
$('.chart3').data('easyPieChart').update(38);
|
||||
}, 35000);
|
||||
setTimeout(function () {
|
||||
$('.chart3').data('easyPieChart').update(79);
|
||||
}, 49000);
|
||||
setTimeout(function () {
|
||||
$('.chart3').data('easyPieChart').update(96);
|
||||
}, 52000);
|
||||
});
|
||||
|
||||
$(function () {
|
||||
//create instance
|
||||
$('.chart4').easyPieChart({
|
||||
animate: 2000,
|
||||
barColor: '#dba26b',
|
||||
trackColor: '#dddddd',
|
||||
scaleColor: '#dba26b',
|
||||
size: 160,
|
||||
lineWidth: 7,
|
||||
});
|
||||
//update instance after 5 sec
|
||||
setTimeout(function () {
|
||||
$('.chart4').data('easyPieChart').update(40);
|
||||
}, 6000);
|
||||
setTimeout(function () {
|
||||
$('.chart4').data('easyPieChart').update(67);
|
||||
}, 14000);
|
||||
setTimeout(function () {
|
||||
$('.chart4').data('easyPieChart').update(43);
|
||||
}, 23000);
|
||||
setTimeout(function () {
|
||||
$('.chart4').data('easyPieChart').update(80);
|
||||
}, 36000);
|
||||
setTimeout(function () {
|
||||
$('.chart4').data('easyPieChart').update(66);
|
||||
}, 41000);
|
||||
});
|
||||
|
||||
$(function () {
|
||||
//create instance
|
||||
$('.chart5').easyPieChart({
|
||||
animate: 3000,
|
||||
barColor: '#1e825e',
|
||||
trackColor: '#dddddd',
|
||||
scaleColor: '#1e825e',
|
||||
size: 160,
|
||||
lineWidth: 7,
|
||||
});
|
||||
//update instance after 5 sec
|
||||
setTimeout(function () {
|
||||
$('.chart5').data('easyPieChart').update(30);
|
||||
}, 9000);
|
||||
setTimeout(function () {
|
||||
$('.chart5').data('easyPieChart').update(87);
|
||||
}, 19000);
|
||||
setTimeout(function () {
|
||||
$('.chart5').data('easyPieChart').update(28);
|
||||
}, 27000);
|
||||
setTimeout(function () {
|
||||
$('.chart5').data('easyPieChart').update(69);
|
||||
}, 39000);
|
||||
setTimeout(function () {
|
||||
$('.chart5').data('easyPieChart').update(99);
|
||||
}, 47000);
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
$("#change_to_bar_graph").click(function(event) {
|
||||
event.preventDefault();
|
||||
$("#charts_body").empty()
|
||||
$("#charts_body").load(<%= sanitize change_graph_dashboard_index_path(:graph => "bar_graph").inspect %>);
|
||||
|
||||
})
|
||||
|
||||
$("#change_to_pie_charts").click(function(event) {
|
||||
event.preventDefault();
|
||||
$("#charts_body").empty()
|
||||
$("#charts_body").load(<%= sanitize change_graph_dashboard_index_path(:graph => "pie_charts").inspect %>);
|
||||
})
|
||||
|
||||
$(document).ready(
|
||||
makeActive,
|
||||
pieChartHome()
|
||||
$("#charts_body").load(<%= sanitize change_graph_dashboard_index_path(:graph => "pie_charts").inspect %>)
|
||||
);
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -1 +1,54 @@
|
||||
<h1> Hello </h1>
|
||||
<div id="column_chart"></div>
|
||||
<!-- Google Visualization JS -->
|
||||
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
// google.load("visualization", "1", {packages:["corechart"]});
|
||||
|
||||
|
||||
|
||||
function drawChart3() {
|
||||
var data = google.visualization.arrayToDataTable([
|
||||
['Year', 'Visitors', 'Orders', 'Income', 'Expenses'],
|
||||
['2007', 300, 800, 900, 300],
|
||||
['2008', 1170, 860, 1220, 564],
|
||||
['2009', 260, 1120, 2870, 2340],
|
||||
['2010', 1030, 540, 3430, 1200],
|
||||
['2011', 200, 700, 1700, 770],
|
||||
['2012', 1170, 2160, 3920, 800], ]);
|
||||
|
||||
var options = {
|
||||
width: 'auto',
|
||||
height: '160',
|
||||
backgroundColor: 'transparent',
|
||||
colors: ['#b5799e', '#579da9', '#e26666', '#1e825e', '#dba26b'],
|
||||
tooltip: {
|
||||
textStyle: {
|
||||
color: '#666666',
|
||||
fontSize: 11
|
||||
},
|
||||
showColorCode: true
|
||||
},
|
||||
legend: {
|
||||
textStyle: {
|
||||
color: 'black',
|
||||
fontSize: 12
|
||||
}
|
||||
},
|
||||
chartArea: {
|
||||
left: 60,
|
||||
top: 10,
|
||||
height: '80%'
|
||||
},
|
||||
};
|
||||
|
||||
var chart = new google.visualization.ColumnChart(document.getElementById('column_chart'));
|
||||
chart.draw(data, options);
|
||||
}
|
||||
|
||||
|
||||
$(document).ready(
|
||||
drawChart3()
|
||||
);
|
||||
|
||||
</script>
|
||||
@@ -47,6 +47,150 @@
|
||||
<!-- End easy pie charts container -->
|
||||
<% end %>
|
||||
<script type="text/javascript">
|
||||
|
||||
function pieChartHome() {
|
||||
$(function () {
|
||||
//create instance
|
||||
$('.chart1').easyPieChart({
|
||||
animate: 2000,
|
||||
barColor: '#e26666',
|
||||
trackColor: '#dddddd',
|
||||
scaleColor: '#e26666',
|
||||
size: 160,
|
||||
lineWidth: 7,
|
||||
});
|
||||
//update instance after 5 sec
|
||||
setTimeout(function () {
|
||||
$('.chart1').data('easyPieChart').update(50);
|
||||
}, 5000);
|
||||
setTimeout(function () {
|
||||
$('.chart1').data('easyPieChart').update(70);
|
||||
}, 10000);
|
||||
setTimeout(function () {
|
||||
$('.chart1').data('easyPieChart').update(30);
|
||||
}, 15000);
|
||||
setTimeout(function () {
|
||||
$('.chart1').data('easyPieChart').update(90);
|
||||
}, 19000);
|
||||
setTimeout(function () {
|
||||
$('.chart1').data('easyPieChart').update(40);
|
||||
}, 32000);
|
||||
});
|
||||
|
||||
$(function () {
|
||||
//create instance
|
||||
$('.chart2').easyPieChart({
|
||||
animate: 2000,
|
||||
barColor: '#b5799e',
|
||||
trackColor: '#dddddd',
|
||||
scaleColor: '#b5799e',
|
||||
size: 160,
|
||||
lineWidth: 7,
|
||||
});
|
||||
//update instance after 5 sec
|
||||
setTimeout(function () {
|
||||
$('.chart2').data('easyPieChart').update(90);
|
||||
}, 10000);
|
||||
setTimeout(function () {
|
||||
$('.chart2').data('easyPieChart').update(40);
|
||||
}, 18000);
|
||||
setTimeout(function () {
|
||||
$('.chart2').data('easyPieChart').update(70);
|
||||
}, 28000);
|
||||
setTimeout(function () {
|
||||
$('.chart2').data('easyPieChart').update(50);
|
||||
}, 32000);
|
||||
setTimeout(function () {
|
||||
$('.chart2').data('easyPieChart').update(80);
|
||||
}, 40000);
|
||||
});
|
||||
|
||||
$(function () {
|
||||
//create instance
|
||||
$('.chart3').easyPieChart({
|
||||
animate: 2000,
|
||||
barColor: '#579da9',
|
||||
trackColor: '#dddddd',
|
||||
scaleColor: '#579da9',
|
||||
size: 160,
|
||||
lineWidth: 7,
|
||||
});
|
||||
//update instance after 5 sec
|
||||
setTimeout(function () {
|
||||
$('.chart3').data('easyPieChart').update(20);
|
||||
}, 9000);
|
||||
setTimeout(function () {
|
||||
$('.chart3').data('easyPieChart').update(59);
|
||||
}, 20000);
|
||||
setTimeout(function () {
|
||||
$('.chart3').data('easyPieChart').update(38);
|
||||
}, 35000);
|
||||
setTimeout(function () {
|
||||
$('.chart3').data('easyPieChart').update(79);
|
||||
}, 49000);
|
||||
setTimeout(function () {
|
||||
$('.chart3').data('easyPieChart').update(96);
|
||||
}, 52000);
|
||||
});
|
||||
|
||||
$(function () {
|
||||
//create instance
|
||||
$('.chart4').easyPieChart({
|
||||
animate: 2000,
|
||||
barColor: '#dba26b',
|
||||
trackColor: '#dddddd',
|
||||
scaleColor: '#dba26b',
|
||||
size: 160,
|
||||
lineWidth: 7,
|
||||
});
|
||||
//update instance after 5 sec
|
||||
setTimeout(function () {
|
||||
$('.chart4').data('easyPieChart').update(40);
|
||||
}, 6000);
|
||||
setTimeout(function () {
|
||||
$('.chart4').data('easyPieChart').update(67);
|
||||
}, 14000);
|
||||
setTimeout(function () {
|
||||
$('.chart4').data('easyPieChart').update(43);
|
||||
}, 23000);
|
||||
setTimeout(function () {
|
||||
$('.chart4').data('easyPieChart').update(80);
|
||||
}, 36000);
|
||||
setTimeout(function () {
|
||||
$('.chart4').data('easyPieChart').update(66);
|
||||
}, 41000);
|
||||
});
|
||||
|
||||
$(function () {
|
||||
//create instance
|
||||
$('.chart5').easyPieChart({
|
||||
animate: 3000,
|
||||
barColor: '#1e825e',
|
||||
trackColor: '#dddddd',
|
||||
scaleColor: '#1e825e',
|
||||
size: 160,
|
||||
lineWidth: 7,
|
||||
});
|
||||
//update instance after 5 sec
|
||||
setTimeout(function () {
|
||||
$('.chart5').data('easyPieChart').update(30);
|
||||
}, 9000);
|
||||
setTimeout(function () {
|
||||
$('.chart5').data('easyPieChart').update(87);
|
||||
}, 19000);
|
||||
setTimeout(function () {
|
||||
$('.chart5').data('easyPieChart').update(28);
|
||||
}, 27000);
|
||||
setTimeout(function () {
|
||||
$('.chart5').data('easyPieChart').update(69);
|
||||
}, 39000);
|
||||
setTimeout(function () {
|
||||
$('.chart5').data('easyPieChart').update(99);
|
||||
}, 47000);
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
$(document).ready(
|
||||
pieChartHome()
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user