I can render a grid with the data I want to use, but not a chart. I have compiled a FULL dhtmlx.js file from libCompiler and can see a DefaultChart data in my chart, but when I point to a different datasource it will not render.
I am using Visual Designer to code the .js file.
I can produce a grid and a default chart as seen below. With the files below. I want to create a Bar Series Chart instead base on the data in the grid.
HTML File
[code]
<link rel="STYLESHEET" type="text/css" href="./codebase/dhtmlx.css">
<style>
/*these styles allows dhtmlxLayout to work in the Full Screen mode in different browsers correctly*/
html, body {
width: 100%;
height: 100%;
margin: 0px;
overflow: hidden;
background-color:white;
}
fpcproj.js file
[code]/function init(){/
/#GENERATED_CODE#/ dhtmlx.image_path=‘./codebase/imgs/’;
var main_layout = new dhtmlXLayoutObject(document.body, '1C');
var Dashboard = main_layout.cells('a');
var tabbar = Dashboard.attachTabbar();
tabbar.addTab('schedule','Schedule','');
var schedule = tabbar.cells('schedule');
tabbar.setTabActive('schedule');
tabbar.addTab('cost','Cost','');
var cost = tabbar.cells('cost');
var costlayout = cost.attachLayout('2U');
var CostWorkSheet = costlayout.cells('a');
CostWorkSheet.setText('Cost Worksheet');
CostWorkSheet.setWidth('400');
var CostData = CostWorkSheet.attachGrid();
CostData.setIconsPath('./codebase/imgs/');
CostData.setHeader(["Phase","Type","Amount"]);
CostData.setColTypes("ro,ro,ro");
CostData.setColSorting('str,str,str');
CostData.init();
CostData.load('./data/CostData.php', 'xml');
var CostBAR = costlayout.cells('b');
CostBAR.setText('By Phase and Type');
var CostBar = CostBAR.attachChart({
view: 'bar' ,
tooltip:{
template:'#sales#'
},
gradient: true,
value:'#sales#'
});
CostBar.load('./data/chart.xml', 'xml');
tabbar.addTab('update','Project Log','');
var update = tabbar.cells('update');
var projectlog = update.attachGrid();
projectlog.setIconsPath('./codebase/imgs/');
projectlog.setHeader(["Date","Narrative"]);
projectlog.setColTypes("ro,ro");
projectlog.setColSorting('str,str');
projectlog.init();
projectlog.load('./data/grid.xml', 'xml');
/#END_GENERATED_CODE#/
/}/[/code]
CostData.php
[code]<?php
require(“…/connector/grid_connector.php”);
require(“…/connector/db_sqlsrv.php”);
require(“cissd.php”);
$conn = sqlsrv_connect( $serverName, $connectionInfo);
$gridConn = new GridConnector($conn,“SQLSrv”);
$gridConn->render_sql(“SELECT Phase, Category, Amount from dbo.CostData(‘FPC307’)”,“”,“Phase, Category, Amount”);
?>[/code]
when I browse to ./data/CostData.php I see this as my data
<?xml version="1.0"?>
<rows>
<row id="Construction">
<cell>Construction</cell>
<cell>ACTUAL</cell>
<cell>4874152.55</cell>
</row>
<row id="Design">
<cell>Design</cell>
<cell>ACTUAL</cell>
<cell>252543.73</cell>
</row>
<row id="DSA Fees">
<cell>DSA Fees</cell>
<cell>ACTUAL</cell>
<cell>99119.00</cell>
</row>
<row id="Fees">
<cell>Fees</cell>
<cell>ACTUAL</cell>
<cell>4805.00</cell>
</row>
<row id="Construction">
<cell>Construction</cell>
<cell>BUDGET</cell>
<cell>24771153.00</cell>
</row>
<row id="Contingency">
<cell>Contingency</cell>
<cell>BUDGET</cell>
<cell>1355844.00</cell>
</row>
<row id="Design">
<cell>Design</cell>
<cell>BUDGET</cell>
<cell>1142534.00</cell>
</row>
<row id="District Labor">
<cell>District Labor</cell>
<cell>BUDGET</cell>
<cell>145232.00</cell>
</row>
<row id="DSA Fees">
<cell>DSA Fees</cell>
<cell>BUDGET</cell>
<cell>212745.00</cell>
</row>
<row id="Equipment">
<cell>Equipment</cell>
<cell>BUDGET</cell>
<cell>.01</cell>
</row>
<row id="Testing">
<cell>Testing</cell>
<cell>BUDGET</cell>
<cell>311373.00</cell>
</row>
<row id="Construction">
<cell>Construction</cell>
<cell>COMMITMENT</cell>
<cell>20156554.09</cell>
</row>
<row id="Contingency">
<cell>Contingency</cell>
<cell>COMMITMENT</cell>
<cell>1032349.00</cell>
</row>
<row id="Design">
<cell>Design</cell>
<cell>COMMITMENT</cell>
<cell>1667166.00</cell>
</row>
<row id="DSA Fees">
<cell>DSA Fees</cell>
<cell>COMMITMENT</cell>
<cell>133593.00</cell>
</row>
<row id="Fees">
<cell>Fees</cell>
<cell>COMMITMENT</cell>
<cell>6704.00</cell>
</row>
<row id="Testing">
<cell>Testing</cell>
<cell>COMMITMENT</cell>
<cell>362646.00</cell>
</row>
</rows>
