Discussion on GraphUp - jQuery Plugin


GeertDD supports this item


This author's response time can be up to 10 business days.

27 comments found.

No sure why this is happening but the table cell data left aligns when I switch a table from “fill” to “bubbles” or “bars”. Looks like hell. When I toggle back to “fill” everything is OK again. Even if I “hardcode” a style for each cell such as “text-align:center”, bars and bubbles override it while fill does not. (All cells are the same size) Same issue in both Chrome and IE 10.

Toggling through the color works fine though.

I added this to the $cell.html…

‘ ’ + $cell.html() + ‘ ‘

Since I could not get the callBeforePaint to override the left-justified, gray/white lettering. Adding the inline style to the code in the js file worked, so I’m happy.

‘ ’ + $cell.html() + ‘ ‘

div style=”position:relative; text-align:center; color:#000000; z-index:2;”>’ + $cell.html() +

Any chance of an update for Datatables using jQuery UI. The bg colours work but the cells don’t seem to be using the correct font colour and styles. {Demo 1}

Never worked with datatables in jQuery UI. I may have a look. Thanks.

I have a setup where I call graphup more than once for some table rows and it doesn’t seem to be supported. After the first call, the color background gets taller than the cell itself and overlaps with the following rows.

I’m using bar displays.

Right, only a single Graphup “painter” is to be applied to a table cell. You can create your own painters, though.

Is there some way to force single values from getting painted with the lowest color value. For example when I have only one color value like 16 and no other cleaned values in the table it is not painted. How do I force it to get the color corresponding to the lowest end of the color map.

That would require a custom painter.

Hello a few questions,

1. Can data from Csv files be copied into table? 2. Are you able to put links in one of the colums?

Thanks in advance

1. However you create the HTML table with its contents is up to you. You could use PHP to generate a table based on csv data. This is not something GraphUp does, but it sure can work with the resulting table.

2. Yes. You need to select the table cells you want to use for GraphUp, so you can ignore certain cells with other data.

Great plugin! I have a dynamic range to adjust the duration of my table. However, when the max value changes down then up (ie: max: 1000 to 500 to 1000 again), and I call the initializer, it does not graph correctly going back up… Is there a way to clear values in the chart?

It actually looks like it’s drawing a new graph over top of the old graphs…

The “bars” painter adds a few div elements to the cell in order to style it correctly: it takes care of the cell padding and the absolute positioning of the bar graph. You can see the relevant code in jquery.graphup.js around line 234.

I assume the problem is that when repainting the cells, another set of div elements is wrapped around the previous ones, etc. In order to prevent this you first have to reset the cell to its original content. No built-in function is available for that. However, if you add a custom “callBeforePaint” function (see the options), you can undo the previous paint by removing the added divs.

Awesome! Thanks for the tip!

Very Cool! How would you integrate this with wordpress?

Well, if you include the GraphUp script in your theme you can just use it as in any other site. GraphUp can then be applied to tables inside your WP posts. I don’t see a big problem there.