Filter dhtmlxChart with data from dhtmlxGrid

Suite and Optimus Suite 5
#1

Hi,

I’m trying to filter results from a dhtmlxChart that gets his data from a dhtmlxGrid.

Same like this post:
viewtopic.php?f=8&t=29642

I’m using example:
dhtmlxSuite_v412_std/samples/dhtmlxChart/09_integration/01_dhtmlxgrid.html
and changed the following part:

function refresh_chart(){
barChart.clearAll();
barChart.parse(mygrid,“dhtmlxgrid”);
};

to:

function refresh_chart(){
barChart.clearAll();
barChart.parse(mygrid,“dhtmlxgrid”);
barChart.filter(function(obj){
if (obj.data0 > 50) return true;
return false;
});
};

However this is not working.

Even when I try the following

barChart.filter(function(obj){
return false;
});

Nothing happens.
Is this a bug? what do I do wrong?

#2

Hi
We managed to reproduce this issue. Wi will fix it in the next build.
And now you need to call
barChart.render();
after calling filter method

#3

Sweet it works again!

The method .render() is not in your api overview
docs.dhtmlx.com/api__refs__dhtmlxchart.html
maybe you could add it as well.

Thank you for the support!

#4

You are welcome!

P.S. Thanx, we will update docs ASAP

#5

I’m wondering about the integration of Grid & Chart, myself!
Here’s the code I’m using :slight_smile:
I took, verbatim, code from the ‘Integration with Grid’ section of this site :slight_smile:
Nothing loads when I run the code :frowning:
I’ve gotten JUST the grid to load perfectly, but when I add the parts regarding the graph, both the grid and the graph don’t load :frowning:

Thanks for any help I can get :slight_smile:
I Can’t figure out how to upload the file… Here it is :slight_smile:

I'll RememberData'

I'll Remember April, Rich Perry

Hoffman Landscapes, Inc. 
	</thead>
	<tbody>
		<div align="center" id="gridbox" style="width:100%;height:500px;"></div>
		<table>
			<tr>
				<td>
					<a href="#" style="color:white" onclick="add_r()" style="color:white">Add Row</a><br/><br/>
					
					<a href="login.php" style="color:white">Logout</a>
				</td>
			</tr>
		</table>
	</tbody>
		<div id="chart_container" style="width:600px;height:300px;"></div>
#6

Hello
You need to include chart library files or use common dhtmlx,js and dhtmlx.css files

#7

Hello!
I’m having trouble connecting a chart to a grid. See below for the snippet. ‘myGrid2’ is the grid I want to take the Data from. ‘myGrid2’ loads fine…

	myChart = new dhtmlXChart({
		view:"donut",
		container:"chart_container",
		value:"#data01#",
		color:"#b9a8f9",
		template: "#data01#"			
		}
	);
	myChart.parse(myGrid2,"dhtmlxgrid");

the DIV fit as follows…

<div id="yesterdayTab">
	<div id="gridbox4" style="width:100%;height:350px;overflow:hidden"></div>
</div>

<div id="lastWeekTab">
	<div id="gridbox5" style="width:100%;height:350px;overflow:hidden"></div>
	<div id="chart_container" style="width:100%;height:250px;border:1px solid #A4BED4"></div>
</div>
#8

Need to specify: where myGrid2 is placed in? In “gridbox4” or “gridbox5”?
And are you going to build tabbar from HTML?

#9

Thanks Darya!
Here’s the grid box info…

//Generates the LastWeek table
var lastWeekHeader =(“Tech, TimeBilled”)
myGrid2 = new dhtmlXGridObject(‘gridbox5’);
myGrid2.setImagePath("./analytics1/dhtmlxSuite_v43_std/codebase/imgs/");
myGrid2.setColumnIds(lastWeekHeader);
myGrid2.setHeader(lastWeekHeader, null, [“text-align:center;”,“text-align:center;”]);
myGrid2.setInitWidthsP(“25,*”);
myGrid2.setColAlign(“center,center”);
myGrid2.setColTypes(“txt,txt”);
myGrid2.setColSorting(“str,int”);
myGrid2.init();
myGrid2.loadXML("./analytics1/get3.php");

//pieChart
myChart = new dhtmlXChart({
view:“donut”,
container:“chart_container”,
value:"#data01#",
color:"#b9a8f9",
template: “#data1#”
}
);
myChart.parse(myGrid2,“dhtmlxgrid”);

and here’s the DIV stuff…

<div id="lastWeekBillablesTab">
	<div id="gridbox5" style="width:100%;height:350px;overflow:hidden"></div>
	<div id="chart_container" style="width:100%;height:250px;border:1px solid #A4BED4"></div>
</div>

Thanks :slight_smile:
You talked about specifying, where and specifically how do i specify anything else?
Thanks!
Great help!
-Eric-

#10

Here is a sample “Init tabbar from html”
dhtmlx.com/docs/products/dhtmlxT … _html.html
Here is a sample “Integration chart with grid”
dhtmlx.com/docs/products/dhtmlxC … xgrid.html
Based on your code and these 2 samples and static grid data from our samples i made demo for you:

[code]

DHTMLX test html,body { width: 100%; height: 100%; margin: 0; }
[/code] There is one important moment you missed: if you build tabbar from HTML, don't forget to add class="dhtmlxTabBar" property to your tabbar div. The result is on the picture:
Screenshot_2.jpg694×677 64.2 KB