We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
|
<div class="control-section">
<div id="sparkline" class="row">
<div class="cols-sample-area">
<script type="text/x-template" id="ord_columnTemp1">
<div id="spkline${EmployeeID}" /> // Here bind the sparkline graph based on EmployeeID data basis
</script>
<script type="text/x-template" id="cus_columnTemp1">
<div id="spkline${EmployeeID}" /> // Here bind the sparkline graph based on EmployeeID data basis
</script>
. . . .
<div class="e-sample-resize-container">
<div id="tab_orientation">
<div class="e-tab-header">
<div>OrderID</div>
<div>CustomerID</div>
</div>
<div class="e-content">
<div>
<div id="Order_Grid">
</div>
</div>
<div>
<div id="Customer_Grid">
</div>
</div>
</div>
</div>
</div>
</div>
<script>
var tabObj = new ej.navigations.Tab({
heightAdjustMode: 'None',
height: 320,
showCloseButton: true,
})
tabObj.appendTo('#tab_orientation');
var grid = new ej.grids.Grid({
. . . .
columns: [
. . . .
{ headerText: 'Tax per annum', template: '#ord_columnTemp1', textAlign: 'Center' }, // bind the sparkline group on grid column
],
});
grid.appendTo('#Order_Grid');
var grid1 = new ej.grids.Grid({
. . . .
columns: [
{ headerText: 'Tax per annum', template: '#cus_columnTemp1', textAlign: 'Center' }, // bind the sparkline group on grid column
],
});
grid1.appendTo('#Customer_Grid');
var line = new ej.charts.Sparkline({
height: '50px',
width: '150px',
lineWidth: 2,
valueType: 'Numeric',
fill: '#3C78EF',
dataSource: getSparkData('line', i)
});
line.appendTo('#spkline' + i); |
