YUI 3 charts - negative numbers in bar chart - Forums

Board index » YUI 3.x: » Using YUI 3.x Components

YUI 3 charts - negative numbers in bar chart

Page 1 of 1

[ 5 posts ]

New Topic | Post Reply | Print view

Previous topic | Next topic

eastfallsglass

Joined: Mon May 02, 2011 6:58 am
Posts: 6

Tags:

YUI 3 charts - negative numbers in bar chart

Posted: Tue May 03, 2011 7:40 am

+0-

Is there a trick to get negative numbers to work in a bar chart? Also I'm trying to create a very simple 'gauge' type chart which has a single bar on it - and the bar seems to be anchored at the top of the chart - is there a way to get the bar to draw centered in the chart area?

Tripp Bridges

YUI Developer

Username: tripp
Joined: Wed Jan 07, 2009 1:54 pm
Posts: 435
GitHub: tripp
Gists: tripp

Tags:

Re: YUI 3 charts - negative numbers in bar chart

Posted: Tue May 03, 2011 9:27 am

+0-

Unfortunately, it looks like you've found a bug in how the column/bar series handles negative values. I have filed a ticket for this and will investigate further:
http://yuilibrary.com/projects/yui3/ticket/2530223

As for the gauge, could you post a link or sample code?

Thanks,
Tripp

eastfallsglass

Joined: Mon May 02, 2011 6:58 am
Posts: 6

Tags:

charts

Re: YUI 3 charts - negative numbers in bar chart

Posted: Tue May 03, 2011 10:25 am

+0-

Here's an example:

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<link type="text/css" rel="stylesheet" href="http://yui.yahooapis.com/3.3.0/build/cssfonts/fonts-min.css" />
<script type="text/javascript" src="http://yui.yahooapis.com/3.3.0/build/yui/yui-min.js"></script>

<style>
.gauge
   {
      width: 250px;
      height: 100px;
   }
</style>
</head>

<body class="yui3-skin-sam  yui-skin-sam">
<div id=c1 class=gauge></div>
<script language=javascript>
var gaugeData = [{ metric: 'sales', amt:120}];

var gaugeAxes = {
   kyf: {
      keys: ['metric'],
      position: 'left',
      type: 'category' },
   scale: {
      keys: ['amt'],
      position: 'bottom',
      type: 'numeric'}
};

var gaugeSeries = [{
   xAxis: 'scale',
   xKey: 'amt',
   yAxis: 'kyf',
   yKey: 'metric',
   yDisplayName: 'Metric'
}];
            

var g1 = {
   type: 'bar',
   axes: gaugeAxes,
   seriesCollection: gaugeSeries,
   dataProvider: gaugeData,
   render: '#c1'
};

var c1;
function initYUI(Y) {
        c1 = Y.Chart(g1);
}

YUI().use('charts', initYUI);
</script>
</body>
</html>

I'd really like the bar to be centered on the chart. Any idea on time-frame for resolution of the negative number issue? The charts are pretty useless for my application without this capability.

Tripp Bridges

YUI Developer

Username: tripp
Joined: Wed Jan 07, 2009 1:54 pm
Posts: 435
GitHub: tripp
Gists: tripp

Tags:

Re: YUI 3 charts - negative numbers in bar chart

Posted: Tue May 03, 2011 11:53 am

+0-

I have pushed a fix to personal github account.
https://github.com/tripp/yui3

Here is the commit
https://github.com/yui/yui3/commit/0e666d19a468e11b2b05e1f8098405500b502f2f

After more testing, I will merge this into the yui master.

You can pull the commit from my github if you want to start working with the change.

I'll look at your sample code and post back.

Thanks,
Tripp

Tripp Bridges

YUI Developer

Username: tripp
Joined: Wed Jan 07, 2009 1:54 pm
Posts: 435
GitHub: tripp
Gists: tripp

Tags:

charts

Re: YUI 3 charts - negative numbers in bar chart

Posted: Tue May 03, 2011 12:25 pm

+0-

The second issue is related to the earlier mentioned bug. The fix posted above resolves this issue as well.

Thanks,
Tripp

Page 1 of 1

[ 5 posts ]

New Topic | Post Reply | Print view

Previous topic | Next topic

You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum