1. Import
This commit is contained in:
471
html/tools/ej_all.php
Normal file
471
html/tools/ej_all.php
Normal file
@@ -0,0 +1,471 @@
|
||||
<?php
|
||||
/*=======================================================================
|
||||
*
|
||||
* ej_all.php
|
||||
*
|
||||
* Autor: Marc Vollmann
|
||||
*
|
||||
=======================================================================*/
|
||||
|
||||
/*
|
||||
http://cdn.syncfusion.com/14.2.0.28/js/web/ej.web.all.min.js
|
||||
http://js.syncfusion.com/demos/web/scripts/jsontreegriddata.js
|
||||
*/
|
||||
|
||||
|
||||
include_once ("../include/mcglobal.inc.php");
|
||||
include_once ("../include/auth.inc.php");
|
||||
|
||||
|
||||
getSecHttpVars ("1",array("f_act", "meta_category", "category", "type", "title", "interval_from", "interval_to", "range_min", "range_max", "range_step", "scale_factor_height", "json"));
|
||||
|
||||
// Die if no data
|
||||
if ($json == "") : die(); endif;
|
||||
|
||||
// Init
|
||||
if ($title == "") : $title = getLngt("Diagramm"); endif;
|
||||
if ($interval_from == "") : $interval_from = getDateTime("year"); endif;
|
||||
if ($interval_to == "") : $interval_to = getDateTime("year"); endif;
|
||||
if ($range_min == "") : $range_min = 0; endif;
|
||||
if ($range_max == "") : $range_max = 1000000; endif;
|
||||
if ($range_step == "") : $range_step = 100000; endif;
|
||||
if ($scale_factor_height == "") : $scale_factor_height = 6; endif;
|
||||
if ($type == "") : $type = "pie"; endif;
|
||||
// echo "interval: " . $interval_from . " - " . $interval_to . "<br>";
|
||||
// echo "range: " . $range_min . " - " . $range_max . " [step: " . $range_step . "]" . "<br>";
|
||||
// Decode
|
||||
$json = urldecode($json);
|
||||
// echo $json;
|
||||
?>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<link rel="stylesheet" type="text/css" href="../css/phoenix.css">
|
||||
<style type="text/css">
|
||||
<?php include_once ("../css/navigation.css.php"); ?>
|
||||
</style>
|
||||
|
||||
<?php include_once ("../include/js_framework.inc.php"); ?>
|
||||
|
||||
<script src="../include/swift.js" type="text/javascript"></script>
|
||||
<script src="../include/iban.js" type="text/javascript"></script>
|
||||
<script src="../include/checkFormTags.js" type="text/javascript"></script>
|
||||
<script src="../include/searchLists.js" type="text/javascript"></script>
|
||||
|
||||
|
||||
<link href="../css/ej/bootstrap.min.css" rel="stylesheet" />
|
||||
<link href="../css/ej/ej.web.all.min.css" rel="stylesheet" />
|
||||
<link href="../css/ej/default.css" rel="stylesheet" />
|
||||
<link href="../css/ej/default-responsive.css" rel="stylesheet" />
|
||||
<link href="../css/ej/ej.responsive.css" rel="stylesheet" />
|
||||
|
||||
<script type="text/javascript" src="../js/ej/jsrender.min.js"></script>
|
||||
|
||||
<script type="text/javascript" src="../js/ej/ej.web.all.min.js"></script>
|
||||
|
||||
<script type="text/javascript" src="../js/ej/properties.js"></script>
|
||||
<!-- <script type="text/javascript" src="../js/ej/jsontreegriddata.js"></script> -->
|
||||
|
||||
<script type="text/javascript">
|
||||
<!--
|
||||
// NAVIGATION
|
||||
<?php echo $jsMenuOut; ?>
|
||||
|
||||
// -----------------------------------------------------------------------------
|
||||
|
||||
// *************
|
||||
// **** Pie ****
|
||||
// *************
|
||||
|
||||
<?php if ($type == "pie" || $type == "1") : ?>
|
||||
|
||||
$(function () {
|
||||
$("#container").ejChart({
|
||||
|
||||
series: [
|
||||
{ points: <?php echo $json; ?>,
|
||||
marker:
|
||||
{
|
||||
dataLabel:
|
||||
{
|
||||
visible:true,
|
||||
shape: 'none',
|
||||
connectorLine: { type: 'bezier',color: 'blue' },
|
||||
font: {size:'14px'}
|
||||
}
|
||||
},
|
||||
border: {width:2, color:'white'},
|
||||
name: 'Expenses',
|
||||
type: 'pie',
|
||||
enableAnimation: true,
|
||||
labelPosition: 'outsideExtended',
|
||||
enableSmartLabels: true,
|
||||
startAngle: 145
|
||||
}
|
||||
],
|
||||
title:{text: '<?php echo $title; ?>'},
|
||||
seriesRendering:"seriesRender",
|
||||
isResponsive: true,
|
||||
size: { height: "<?php echo ($scale_factor_height * 100) ?>"},
|
||||
legend: { visible: false}
|
||||
});
|
||||
});
|
||||
|
||||
function seriesRender(sender) {
|
||||
if(sender.model.theme=="flatdark" || sender.model.theme=="gradientdark")
|
||||
sender.data.series.marker.dataLabel.connectorLine.color="white";
|
||||
}
|
||||
|
||||
<?php endif; ?>
|
||||
|
||||
// -----------------------------------------------------------------------------
|
||||
|
||||
// *****************************
|
||||
// **** 100% Stacked Column ****
|
||||
// *****************************
|
||||
|
||||
<?php if ($type == "100pct_stacked_column" || $type == "10") : ?>
|
||||
|
||||
$(function () {
|
||||
$("#container").ejChart({
|
||||
|
||||
// Initializing Primary X Axis
|
||||
primaryXAxis: {
|
||||
title: { text: '<?php echo getLngt("Jahr") ?>' },
|
||||
range: { min: <?php echo ($interval_from - 1); ?>, max: <?php echo ($interval_to + 1); ?>, interval: 1 },
|
||||
majorGridLines: { visible: false }
|
||||
},
|
||||
|
||||
// Initializing Primary Y Axis
|
||||
primaryYAxis: {
|
||||
title: { text: '<?php echo getDateTime("Aufteilung") ?>' }
|
||||
},
|
||||
|
||||
// Initializing Common Properties for all the series
|
||||
commonSeriesOptions: {
|
||||
type: 'stackingcolumn100',
|
||||
EnableAnimation: true,
|
||||
tooltip : {
|
||||
visible :true ,
|
||||
format: " #series.name# <br/>X : #point.x# <br/> Y : #point.y# <br/>Growth Percentage : #point.percentage# % "
|
||||
}
|
||||
},
|
||||
|
||||
// Initializing Series
|
||||
series: <?php echo $json; ?>,
|
||||
isResponsive: true,
|
||||
load: "loadTheme",
|
||||
title :{text: '<?php echo $title; ?>'},
|
||||
size: { height: "<?php echo ($scale_factor_height * 100) ?>"},
|
||||
legend: { visible: true }
|
||||
});
|
||||
});
|
||||
|
||||
<?php endif; ?>
|
||||
|
||||
// -----------------------------------------------------------------------------
|
||||
|
||||
// *************
|
||||
// **** Bar ****
|
||||
// *************
|
||||
|
||||
<?php if ($type == "bar" || $type == "2" || $type == "11") : ?>
|
||||
|
||||
$(function () {
|
||||
$("#container").ejChart({
|
||||
|
||||
// Initializing Primary X Axis
|
||||
primaryXAxis: {
|
||||
title: { text: '<?php echo getLngt("Jahr") ?>' },
|
||||
range: { min: <?php echo ($interval_from - 1); ?>, max: <?php echo ($interval_to + 1); ?>, interval: 1 }
|
||||
},
|
||||
|
||||
// Initializing Primary Y Axis
|
||||
primaryYAxis: {
|
||||
range: { min: <?php echo $range_min; ?>, max: <?php echo $range_max; ?>, interval: <?php echo $range_step; ?> },
|
||||
labelFormat:"{value}",
|
||||
title: { text: '<?php echo getLngt("Umsatz") ?>' }
|
||||
},
|
||||
|
||||
// Initializing Common Properties for all the series
|
||||
commonSeriesOptions: {
|
||||
type: 'bar',
|
||||
enableAnimation: true,
|
||||
tooltip:{visible:true, format: "#series.name# <br/> #point.x# : #point.y#"},
|
||||
marker:
|
||||
{
|
||||
dataLabel:
|
||||
{
|
||||
font: { size:'13px',fontFamily:'Segoe UI',fontStyle:'Normal',fontWeight:'regular'},
|
||||
textPosition: 'top',
|
||||
horizontalTextAlignment:"near",
|
||||
visible:true
|
||||
},
|
||||
}
|
||||
},
|
||||
|
||||
//Initializing Series
|
||||
series: <?php echo $json; ?>,
|
||||
load:"loadTheme",
|
||||
displayTextRendering:"OndataLabel",
|
||||
isResponsive: true,
|
||||
showTooltip: true,
|
||||
title:{text: '<?php echo $title; ?>'},
|
||||
size: { height: "<?php echo ($scale_factor_height * 100) ?>" },
|
||||
legend: { visible: true, position: 'right', alignment:"near" }
|
||||
});
|
||||
});
|
||||
|
||||
function OndataLabel(sender) {
|
||||
sender.data.location.x=sender.data.location.x+20;
|
||||
}
|
||||
|
||||
<?php endif; ?>
|
||||
|
||||
// -----------------------------------------------------------------------------
|
||||
|
||||
// **********************
|
||||
// **** Stacked Area ****
|
||||
// **********************
|
||||
|
||||
<?php if ($type == "stacked_area" || $type == "12") : ?>
|
||||
|
||||
$(function () {
|
||||
$("#container").ejChart({
|
||||
|
||||
// Initializing Primary X Axis
|
||||
primaryXAxis: {
|
||||
axisLine:{visible:false},
|
||||
majorGridLines:{visible:false},
|
||||
majorTickLines: { visible: false },
|
||||
range: { min: <?php echo ($interval_from - 1); ?>, max: <?php echo ($interval_to + 1); ?>, interval: 1 },
|
||||
title: { text: '<?php echo getLngt("Jahr") ?>' }
|
||||
},
|
||||
|
||||
// Initializing Primary Y Axis
|
||||
primaryYAxis: {
|
||||
axisLine: { visible: false },
|
||||
majorTickLines: { visible: false },
|
||||
range: { min: <?php echo $range_min; ?>, max: <?php echo $range_max; ?>, interval: <?php echo $range_step; ?> },
|
||||
title: { text: '<?php echo getLngt("Umsatz") ?>' }
|
||||
},
|
||||
|
||||
// Initializing Common Properties for all the series
|
||||
commonSeriesOptions: {
|
||||
type: 'stackingarea',
|
||||
EnableAnimation: true
|
||||
},
|
||||
|
||||
// Initializing Series
|
||||
series: <?php echo $json; ?> ,
|
||||
load:"loadTheme",
|
||||
isResponsive: true,
|
||||
title:{text: '<?php echo $title; ?>' },
|
||||
size: { height: "<?php echo ($scale_factor_height * 100) ?>" },
|
||||
legend: { visible: true }
|
||||
});
|
||||
});
|
||||
|
||||
<?php endif; ?>
|
||||
|
||||
// -----------------------------------------------------------------------------
|
||||
|
||||
// **************
|
||||
// **** Area ****
|
||||
// **************
|
||||
|
||||
<?php if ($type == "area" || $type == "13") : ?>
|
||||
|
||||
$(function () {
|
||||
$("#container").ejChart({
|
||||
|
||||
// Initializing Primary X Axis
|
||||
primaryXAxis: {
|
||||
axisLine:{visible:false},
|
||||
majorGridLines:{visible:false},
|
||||
majorTickLines: { visible: false },
|
||||
range: { min: <?php echo ($interval_from - 1); ?>, max: <?php echo ($interval_to + 1); ?>, interval: 1 },
|
||||
title: { text: '<?php echo getLngt("Jahr") ?>' }
|
||||
},
|
||||
|
||||
// Initializing Primary Y Axis
|
||||
primaryYAxis: {
|
||||
axisLine: { visible: false },
|
||||
majorTickLines: { visible: false },
|
||||
range: { min: <?php echo $range_min; ?>, max: <?php echo $range_max; ?>, interval: <?php echo $range_step; ?> },
|
||||
title: { text: '<?php echo getLngt("Umsatz") ?>' }
|
||||
},
|
||||
|
||||
// Initializing Series
|
||||
series: <?php echo $json; ?> ,
|
||||
load:"loadTheme",
|
||||
isResponsive: true,
|
||||
title:{text: '<?php echo $title; ?>' },
|
||||
size: { height: "<?php echo ($scale_factor_height * 100) ?>" },
|
||||
legend: { visible: true }
|
||||
});
|
||||
});
|
||||
|
||||
<?php endif; ?>
|
||||
|
||||
// -----------------------------------------------------------------------------
|
||||
/*
|
||||
// **** Default Functionalities ****
|
||||
$(function () {
|
||||
$("#TreeGridContainer").ejTreeGrid({
|
||||
dataSource: sampleData,
|
||||
childMapping: "subtasks",
|
||||
treeColumnIndex: 1,
|
||||
allowColumnResize: true,
|
||||
isResponsive: true,
|
||||
columns: [
|
||||
{ field: "taskID", headerText: "Task Id", width: "45" },
|
||||
{ field: "taskName", headerText: "Task Name" },
|
||||
{ field: "startDate", headerText: "Start Date" },
|
||||
{ field: "endDate", headerText: "End Date" },
|
||||
{ field: "duration", headerText: "Duration" },
|
||||
{ field: "progress", headerText: "Progress" },
|
||||
{ field: "priority", headerText: "Priorität" }
|
||||
]
|
||||
})
|
||||
});
|
||||
*/
|
||||
// -----------------------------------------------------------------------------
|
||||
|
||||
function finishPage(f_act_value) {
|
||||
document.forms[0].f_act.value=f_act_value;
|
||||
document.forms[0].submit();
|
||||
};
|
||||
</script>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="content-container-fluid">
|
||||
<div class="row">
|
||||
<div class="cols-sample-area">
|
||||
|
||||
<!-- ejChart() [PIE, 100% Stacked Column] -->
|
||||
<div id="container"></div>
|
||||
|
||||
<!-- ejTreeGrid() -->
|
||||
<div id="TreeGridContainer" style="height:350px;width:100%;"></div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
<?php
|
||||
/*
|
||||
// Pie
|
||||
points: [{ x: 'Other Personnal', y: 94658, text: 'Other Personal, 88.47%' },
|
||||
{ x: 'Medical care', y: 9090, text: 'Medical care, 8.49%' },
|
||||
{ x: 'Housing', y: 2577, text: 'Housing, 2.40%' },
|
||||
{ x: 'Transportation', y: 473, text: 'Transportation, 0.44%' },
|
||||
{ x: 'Education', y: 120, text: 'Education, 0.11%' },
|
||||
{ x: 'Electronics', y: 70, text: 'Electronics, 0.06%' }],
|
||||
|
||||
$json = array();
|
||||
array_push($json,array("x" => "MC","y" => 45,"text" => "MC : 45%"));
|
||||
array_push($json,array("x" => "Conan","y" => 33,"text" => "Conan : 33%"));
|
||||
array_push($json,array("x" => "Caddy","y" => 22,"text" => "Caddy : 22%"));
|
||||
$json = json_encode($json);
|
||||
|
||||
echo $json . "<br><br>";
|
||||
$json = str_replace("\"x\"", "x", $json);
|
||||
$json = str_replace("\"y\"", "y", $json);
|
||||
$json = str_replace("\"text\"", "text", $json);
|
||||
$json = str_replace("\"", "'", $json);
|
||||
echo $json . "<br><br>";
|
||||
|
||||
// 100% Stacked Column
|
||||
series: [
|
||||
{
|
||||
points: [{ x: 2006, y:900 }, { x: 2007, y: 544}, { x: 2008, y: 880}, { x: 2009, y: 675 },
|
||||
{ x: 2010, y: 765}, { x: 2011, y:679}, { x: 2012, y: 770}],
|
||||
name: "USA",
|
||||
},
|
||||
{
|
||||
points: [{ x: 2006, y:190 }, { x: 2007, y:226}, { x: 2008, y:194}, { x: 2009, y:250},
|
||||
{ x: 2010, y: 222}, { x: 2011, y:181}, { x: 2012, y:128}],
|
||||
name: "India",
|
||||
},
|
||||
{
|
||||
points: [{ x: 2006, y:250}, { x: 2007, y:145}, { x: 2008, y:190}, { x: 2009, y:220},
|
||||
{ x: 2010, y:225}, { x: 2011, y:135}, { x: 2012, y:152}],
|
||||
name: "China",
|
||||
},
|
||||
{
|
||||
points: [{ x: 2006, y:150}, { x: 2007, y:120}, { x: 2008, y:115}, { x: 2009, y:125},
|
||||
{ x: 2010, y:132}, { x: 2011, y:137}, { x: 2012, y:110}],
|
||||
name: "Canada",
|
||||
}
|
||||
],
|
||||
|
||||
// Bar
|
||||
series: [
|
||||
{
|
||||
points: [{ x: 2006, y: 7.8 }, { x: 2007, y: 7.2}, { x: 2008, y: 6.8 }, { x: 2009, y: 10.7 },
|
||||
{ x: 2010, y: 10.8}, { x: 2011, y: 9.8 }],
|
||||
name: 'India'
|
||||
},
|
||||
{
|
||||
points: [{ x: 2006, y: 4.8 }, { x: 2007, y: 4.6 }, { x: 2008, y: 7.2 }, { x: 2009, y: 9.3 },
|
||||
{ x: 2010, y: 9.7}, { x: 2011, y: 9 }],
|
||||
name: 'US'
|
||||
}
|
||||
],
|
||||
|
||||
// Stacked Area
|
||||
series:
|
||||
[
|
||||
{
|
||||
points: [{ x: 2002, y: 6 }, { x: 2003, y: 7.5 }, { x: 2004, y: 6 }, { x: 2005, y: 6.5 },
|
||||
{ x: 2006, y: 7.4 }, { x: 2007, y: 7.9 }, { x: 2008, y: 7.5 }, { x: 2009, y: 8.5 },
|
||||
{ x: 2010, y: 4.8 }, { x: 2011, y: 9.3 }],
|
||||
name: 'US',
|
||||
border :{color: 'transparent'},
|
||||
opacity: 0.5,
|
||||
fill: '#C4C24A'
|
||||
}
|
||||
],
|
||||
|
||||
// Area
|
||||
series: [
|
||||
{
|
||||
points: [{ x: 1900, y: 4 }, { x: 1920, y: 3.0 },{ x: 1940, y: 3.8 }, { x: 1960, y: 3.4 },
|
||||
{ x: 1980, y: 3.2 }, { x: 2000, y: 3.9 }],
|
||||
name: 'Product A',
|
||||
type: 'Area',
|
||||
enableAnimation: true,
|
||||
border:{color: 'transparent'},
|
||||
opacity: 0.5,
|
||||
fill:'#69D2E7'
|
||||
},
|
||||
{
|
||||
points: [{ x: 1900, y: 2.6 }, { x: 1920, y: 2.8 },{ x: 1940, y: 2.6 }, { x: 1960, y: 3 },
|
||||
{ x: 1980, y: 3.6 }, { x: 2000, y: 3 }],
|
||||
name: 'Product B',
|
||||
type: 'Area',
|
||||
enableAnimation: true,
|
||||
opacity: 0.5,
|
||||
border: { color: 'transparent' },
|
||||
fill: '#C4C24A'
|
||||
},
|
||||
{
|
||||
points: [{ x: 1900, y: 2.8 }, { x: 1920, y: 2.5 },{ x: 1940, y: 2.8 }, { x: 1960, y: 3.2 },
|
||||
{ x: 1980, y: 2.9 }, { x: 2000, y: 2 }],
|
||||
name: 'Product C',
|
||||
type: 'Area',
|
||||
enableAnimation: true,
|
||||
opacity: 0.5,
|
||||
border:{color: 'transparent'},
|
||||
fill: '#6A4B82'
|
||||
}
|
||||
]
|
||||
*/
|
||||
?>
|
||||
Reference in New Issue
Block a user