Small, short code snippets that other people may find useful. Do you have a good regex that you would like to share? Share it! Even better, the code can be commented on, and improved.
Moderator: General Moderators
Roja
Tutorials Group
Posts: 2692 Joined: Sun Jan 04, 2004 10:30 pm
Post
by Roja » Fri Mar 03, 2006 7:49 am
darryladie wrote: Hiya, this project is
fantastic . However, the link to the PHP4 version is broken.
Anywhere else I can get hold a copy
Its in the CVS repository of the sourceforge project. If I have a chance this weekend, I'll see if I can do a zip release for the php4 version. Until then, you can do an anonymous checkout.
darryladie wrote: If you created two stylesheets, one for screen and the other for print then the code would be even better.
I had planned on doing so, but the *only* thing that is needed in the print stylesheet is a different handling for the bars themselves. Since we didn't have a solution for that, I didn't make a print stylesheet (as there wouldnt be anything in it).
If we find a solution for it, yes, we'll be doing two imports.. one on print, and one on the standard.
However, the stylesheet is generated dynamically, so you would still have to "get your hands dirty" with php either way. We may reduce the interaction quite a bit in the future, by pushing out most of the style into standalone sheets.
darryladie
Forum Commoner
Posts: 62 Joined: Thu Mar 02, 2006 6:14 pm
Location: East Sussex, UK
Post
by darryladie » Fri Mar 03, 2006 8:24 am
OK great, I will check it out!
Yes that's what I was suggesting standalone stylesheets. PHP would generate the HTML with CSS classes embedded in the tags with the styles then being linked using stylesheets. That way in the future people who aren't confident with PHP could edit the CSS and draw graph functions.
It would be more code efficient as well, as if it needed to be any faster
darryladie
Forum Commoner
Posts: 62 Joined: Thu Mar 02, 2006 6:14 pm
Location: East Sussex, UK
Post
by darryladie » Fri Mar 03, 2006 8:27 am
Any chance of a .ZIP version of the d/l on SF please?
Roja
Tutorials Group
Posts: 2692 Joined: Sun Jan 04, 2004 10:30 pm
Post
by Roja » Fri Mar 03, 2006 8:28 am
darryladie wrote: Any chance of a .ZIP version of the d/l on SF please?
Read harder.
Roja wrote: If I have a chance this weekend, I'll see if I can do a zip release for the php4 version.
darryladie
Forum Commoner
Posts: 62 Joined: Thu Mar 02, 2006 6:14 pm
Location: East Sussex, UK
Post
by darryladie » Fri Mar 03, 2006 8:32 am
My apologies.
Missed that bit (obviously!)
Thanks again for all your hard work
Darryl
danf_1979
Forum Commoner
Posts: 72 Joined: Sun Feb 20, 2005 9:46 pm
Post
by danf_1979 » Tue Mar 28, 2006 11:53 pm
Can this be used to render graphs in propietary software?
Roja
Tutorials Group
Posts: 2692 Joined: Sun Jan 04, 2004 10:30 pm
Post
by Roja » Wed Mar 29, 2006 4:50 am
danf_1979 wrote: Can this be used to render graphs in propietary software?
It is released under the GPL. Please read the License file included in the download for the specific requirements and conditions for its use.
Chris Corbyn
Breakbeat Nuttzer
Posts: 13098 Joined: Wed Mar 24, 2004 7:57 am
Location: Melbourne, Australia
Post
by Chris Corbyn » Fri Apr 07, 2006 7:36 am
I've been thinking about this and I may restructure it to use an unordered list in some fashion as means of keeping things solid when it renders... a table is another way to do it but I'd rather not use a table for whatever reason.
Chris Corbyn
Breakbeat Nuttzer
Posts: 13098 Joined: Wed Mar 24, 2004 7:57 am
Location: Melbourne, Australia
Post
by Chris Corbyn » Wed Apr 12, 2006 5:57 pm
OK a little challenge. I'm rewriting this to use a central class to do a generic graphing and bundling it with various graph types... so far Bar, Line/Scatter, Pie Chart (all in CSS of course).
The basic idea behind the markup for a pie chart looks like that below. Question: It's a huge amount of markup and I'm wondering if custom XML may be better. Does anyone know if it's tricky to have it render the same using something like the XML below? (See bottom of post).
Code: Select all
<style type="text/css">
.point {
position: absolute;
width: 1px;
height: 1px;
background: #AA1111;
font-size: 1px;
}
</style>
<div class="point" style="top: 80px; left: 40px;"> </div>
<div class="point" style="top: 80px; left: 120px;"> </div>
<div class="point" style="top: 88.89px; left: 41px;"> </div>
<div class="point" style="top: 71.11px; left: 119px;"> </div>
<div class="point" style="top: 92.49px; left: 42px;"> </div>
<div class="point" style="top: 67.51px; left: 118px;"> </div>
<div class="point" style="top: 95.2px; left: 43px;"> </div>
<div class="point" style="top: 64.8px; left: 117px;"> </div>
<div class="point" style="top: 97.44px; left: 44px;"> </div>
<div class="point" style="top: 62.56px; left: 116px;"> </div>
<div class="point" style="top: 99.36px; left: 45px;"> </div>
<div class="point" style="top: 60.64px; left: 115px;"> </div>
<div class="point" style="top: 101.07px; left: 46px;"> </div>
<div class="point" style="top: 58.93px; left: 114px;"> </div>
<div class="point" style="top: 102.61px; left: 47px;"> </div>
<div class="point" style="top: 57.39px; left: 113px;"> </div>
<div class="point" style="top: 104px; left: 48px;"> </div>
<div class="point" style="top: 56px; left: 112px;"> </div>
<div class="point" style="top: 105.28px; left: 49px;"> </div>
<div class="point" style="top: 54.72px; left: 111px;"> </div>
<div class="point" style="top: 106.46px; left: 50px;"> </div>
<div class="point" style="top: 53.54px; left: 110px;"> </div>
<div class="point" style="top: 107.55px; left: 51px;"> </div>
<div class="point" style="top: 52.45px; left: 109px;"> </div>
<div class="point" style="top: 108.57px; left: 52px;"> </div>
<div class="point" style="top: 51.43px; left: 108px;"> </div>
<div class="point" style="top: 109.51px; left: 53px;"> </div>
<div class="point" style="top: 50.49px; left: 107px;"> </div>
<div class="point" style="top: 110.4px; left: 54px;"> </div>
<div class="point" style="top: 49.6px; left: 106px;"> </div>
<div class="point" style="top: 111.22px; left: 55px;"> </div>
<div class="point" style="top: 48.78px; left: 105px;"> </div>
<div class="point" style="top: 112px; left: 56px;"> </div>
<div class="point" style="top: 48px; left: 104px;"> </div>
<div class="point" style="top: 112.73px; left: 57px;"> </div>
<div class="point" style="top: 47.27px; left: 103px;"> </div>
<div class="point" style="top: 113.41px; left: 58px;"> </div>
<div class="point" style="top: 46.59px; left: 102px;"> </div>
<div class="point" style="top: 114.04px; left: 59px;"> </div>
<div class="point" style="top: 45.96px; left: 101px;"> </div>
<div class="point" style="top: 114.64px; left: 60px;"> </div>
<div class="point" style="top: 45.36px; left: 100px;"> </div>
<div class="point" style="top: 115.2px; left: 61px;"> </div>
<div class="point" style="top: 44.8px; left: 99px;"> </div>
<div class="point" style="top: 115.72px; left: 62px;"> </div>
<div class="point" style="top: 44.28px; left: 98px;"> </div>
<div class="point" style="top: 116.21px; left: 63px;"> </div>
<div class="point" style="top: 43.79px; left: 97px;"> </div>
<div class="point" style="top: 116.66px; left: 64px;"> </div>
<div class="point" style="top: 43.34px; left: 96px;"> </div>
<div class="point" style="top: 117.08px; left: 65px;"> </div>
<div class="point" style="top: 42.92px; left: 95px;"> </div>
<div class="point" style="top: 117.47px; left: 66px;"> </div>
<div class="point" style="top: 42.53px; left: 94px;"> </div>
<div class="point" style="top: 117.83px; left: 67px;"> </div>
<div class="point" style="top: 42.17px; left: 93px;"> </div>
<div class="point" style="top: 118.16px; left: 68px;"> </div>
<div class="point" style="top: 41.84px; left: 92px;"> </div>
<div class="point" style="top: 118.46px; left: 69px;"> </div>
<div class="point" style="top: 41.54px; left: 91px;"> </div>
<div class="point" style="top: 118.73px; left: 70px;"> </div>
<div class="point" style="top: 41.27px; left: 90px;"> </div>
<div class="point" style="top: 118.97px; left: 71px;"> </div>
<div class="point" style="top: 41.03px; left: 89px;"> </div>
<div class="point" style="top: 119.19px; left: 72px;"> </div>
<div class="point" style="top: 40.81px; left: 88px;"> </div>
<div class="point" style="top: 119.38px; left: 73px;"> </div>
<div class="point" style="top: 40.62px; left: 87px;"> </div>
<div class="point" style="top: 119.55px; left: 74px;"> </div>
<div class="point" style="top: 40.45px; left: 86px;"> </div>
<div class="point" style="top: 119.69px; left: 75px;"> </div>
<div class="point" style="top: 40.31px; left: 85px;"> </div>
<div class="point" style="top: 119.8px; left: 76px;"> </div>
<div class="point" style="top: 40.2px; left: 84px;"> </div>
<div class="point" style="top: 119.89px; left: 77px;"> </div>
<div class="point" style="top: 40.11px; left: 83px;"> </div>
<div class="point" style="top: 119.95px; left: 78px;"> </div>
<div class="point" style="top: 40.05px; left: 82px;"> </div>
<div class="point" style="top: 119.99px; left: 79px;"> </div>
<div class="point" style="top: 40.01px; left: 81px;"> </div>
<div class="point" style="top: 120px; left: 80px;"> </div>
<div class="point" style="top: 40px; left: 80px;"> </div>
<div class="point" style="top: 119.99px; left: 81px;"> </div>
<div class="point" style="top: 40.01px; left: 79px;"> </div>
<div class="point" style="top: 119.95px; left: 82px;"> </div>
<div class="point" style="top: 40.05px; left: 78px;"> </div>
<div class="point" style="top: 119.89px; left: 83px;"> </div>
<div class="point" style="top: 40.11px; left: 77px;"> </div>
<div class="point" style="top: 119.8px; left: 84px;"> </div>
<div class="point" style="top: 40.2px; left: 76px;"> </div>
<div class="point" style="top: 119.69px; left: 85px;"> </div>
<div class="point" style="top: 40.31px; left: 75px;"> </div>
<div class="point" style="top: 119.55px; left: 86px;"> </div>
<div class="point" style="top: 40.45px; left: 74px;"> </div>
<div class="point" style="top: 119.38px; left: 87px;"> </div>
<div class="point" style="top: 40.62px; left: 73px;"> </div>
<div class="point" style="top: 119.19px; left: 88px;"> </div>
<div class="point" style="top: 40.81px; left: 72px;"> </div>
<div class="point" style="top: 118.97px; left: 89px;"> </div>
<div class="point" style="top: 41.03px; left: 71px;"> </div>
<div class="point" style="top: 118.73px; left: 90px;"> </div>
<div class="point" style="top: 41.27px; left: 70px;"> </div>
<div class="point" style="top: 118.46px; left: 91px;"> </div>
<div class="point" style="top: 41.54px; left: 69px;"> </div>
<div class="point" style="top: 118.16px; left: 92px;"> </div>
<div class="point" style="top: 41.84px; left: 68px;"> </div>
<div class="point" style="top: 117.83px; left: 93px;"> </div>
<div class="point" style="top: 42.17px; left: 67px;"> </div>
<div class="point" style="top: 117.47px; left: 94px;"> </div>
<div class="point" style="top: 42.53px; left: 66px;"> </div>
<div class="point" style="top: 117.08px; left: 95px;"> </div>
<div class="point" style="top: 42.92px; left: 65px;"> </div>
<div class="point" style="top: 116.66px; left: 96px;"> </div>
<div class="point" style="top: 43.34px; left: 64px;"> </div>
<div class="point" style="top: 116.21px; left: 97px;"> </div>
<div class="point" style="top: 43.79px; left: 63px;"> </div>
<div class="point" style="top: 115.72px; left: 98px;"> </div>
<div class="point" style="top: 44.28px; left: 62px;"> </div>
<div class="point" style="top: 115.2px; left: 99px;"> </div>
<div class="point" style="top: 44.8px; left: 61px;"> </div>
<div class="point" style="top: 114.64px; left: 100px;"> </div>
<div class="point" style="top: 45.36px; left: 60px;"> </div>
<div class="point" style="top: 114.04px; left: 101px;"> </div>
<div class="point" style="top: 45.96px; left: 59px;"> </div>
<div class="point" style="top: 113.41px; left: 102px;"> </div>
<div class="point" style="top: 46.59px; left: 58px;"> </div>
<div class="point" style="top: 112.73px; left: 103px;"> </div>
<div class="point" style="top: 47.27px; left: 57px;"> </div>
<div class="point" style="top: 112px; left: 104px;"> </div>
<div class="point" style="top: 48px; left: 56px;"> </div>
<div class="point" style="top: 111.22px; left: 105px;"> </div>
<div class="point" style="top: 48.78px; left: 55px;"> </div>
<div class="point" style="top: 110.4px; left: 106px;"> </div>
<div class="point" style="top: 49.6px; left: 54px;"> </div>
<div class="point" style="top: 109.51px; left: 107px;"> </div>
<div class="point" style="top: 50.49px; left: 53px;"> </div>
<div class="point" style="top: 108.57px; left: 108px;"> </div>
<div class="point" style="top: 51.43px; left: 52px;"> </div>
<div class="point" style="top: 107.55px; left: 109px;"> </div>
<div class="point" style="top: 52.45px; left: 51px;"> </div>
<div class="point" style="top: 106.46px; left: 110px;"> </div>
<div class="point" style="top: 53.54px; left: 50px;"> </div>
<div class="point" style="top: 105.28px; left: 111px;"> </div>
<div class="point" style="top: 54.72px; left: 49px;"> </div>
<div class="point" style="top: 104px; left: 112px;"> </div>
<div class="point" style="top: 56px; left: 48px;"> </div>
<div class="point" style="top: 102.61px; left: 113px;"> </div>
<div class="point" style="top: 57.39px; left: 47px;"> </div>
<div class="point" style="top: 101.07px; left: 114px;"> </div>
<div class="point" style="top: 58.93px; left: 46px;"> </div>
<div class="point" style="top: 99.36px; left: 115px;"> </div>
<div class="point" style="top: 60.64px; left: 45px;"> </div>
<div class="point" style="top: 97.44px; left: 116px;"> </div>
<div class="point" style="top: 62.56px; left: 44px;"> </div>
<div class="point" style="top: 95.2px; left: 117px;"> </div>
<div class="point" style="top: 64.8px; left: 43px;"> </div>
<div class="point" style="top: 92.49px; left: 118px;"> </div>
<div class="point" style="top: 67.51px; left: 42px;"> </div>
<div class="point" style="top: 88.89px; left: 119px;"> </div>
<div class="point" style="top: 71.11px; left: 41px;"> </div>
<div class="point" style="top: 80px; left: 120px;"> </div>
<div class="point" style="top: 80px; left: 40px;"> </div>
<div class="point" style="top: 80px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 81px;"> </div>
<div class="point" style="top: 81px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 82px;"> </div>
<div class="point" style="top: 82px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 83px;"> </div>
<div class="point" style="top: 83px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 84px;"> </div>
<div class="point" style="top: 84px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 85px;"> </div>
<div class="point" style="top: 85px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 86px;"> </div>
<div class="point" style="top: 86px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 87px;"> </div>
<div class="point" style="top: 87px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 88px;"> </div>
<div class="point" style="top: 88px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 89px;"> </div>
<div class="point" style="top: 89px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 90px;"> </div>
<div class="point" style="top: 90px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 91px;"> </div>
<div class="point" style="top: 91px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 92px;"> </div>
<div class="point" style="top: 92px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 93px;"> </div>
<div class="point" style="top: 93px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 94px;"> </div>
<div class="point" style="top: 94px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 95px;"> </div>
<div class="point" style="top: 95px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 96px;"> </div>
<div class="point" style="top: 96px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 97px;"> </div>
<div class="point" style="top: 97px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 98px;"> </div>
<div class="point" style="top: 98px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 99px;"> </div>
<div class="point" style="top: 99px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 100px;"> </div>
<div class="point" style="top: 100px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 101px;"> </div>
<div class="point" style="top: 101px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 102px;"> </div>
<div class="point" style="top: 102px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 103px;"> </div>
<div class="point" style="top: 103px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 104px;"> </div>
<div class="point" style="top: 104px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 105px;"> </div>
<div class="point" style="top: 105px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 106px;"> </div>
<div class="point" style="top: 106px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 107px;"> </div>
<div class="point" style="top: 107px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 108px;"> </div>
<div class="point" style="top: 108px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 109px;"> </div>
<div class="point" style="top: 109px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 110px;"> </div>
<div class="point" style="top: 110px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 111px;"> </div>
<div class="point" style="top: 111px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 112px;"> </div>
<div class="point" style="top: 112px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 113px;"> </div>
<div class="point" style="top: 113px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 114px;"> </div>
<div class="point" style="top: 114px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 115px;"> </div>
<div class="point" style="top: 115px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 116px;"> </div>
<div class="point" style="top: 116px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 117px;"> </div>
<div class="point" style="top: 117px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 118px;"> </div>
<div class="point" style="top: 118px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 119px;"> </div>
<div class="point" style="top: 119px; left: 80px;"> </div>
<div class="point" style="top: 80px; left: 120px;"> </div>
<div class="point" style="top: 120px; left: 80px;"> </div>
Using some sort of custom XML:
EDIT | This will appear in CVS when I feel there's enough to get going with.
s00263668
Forum Newbie
Posts: 6 Joined: Tue Jul 18, 2006 9:48 pm
Post
by s00263668 » Wed Jul 19, 2006 10:19 pm
can i have some picture snapshots?
Chris Corbyn
Breakbeat Nuttzer
Posts: 13098 Joined: Wed Mar 24, 2004 7:57 am
Location: Melbourne, Australia
Post
by Chris Corbyn » Thu Jul 20, 2006 6:35 am
s00263668 wrote: can i have some picture snapshots?
There are three examples linked to in the second post of this thread. I'm no longer actively developing this for the time being although it's not "dead" since I'll likely continue with it in the future when I have a little more time. ~Roja is also on the development team for this and has made some changes which are available on SourceForge.
Hades
Forum Commoner
Posts: 35 Joined: Mon May 08, 2006 4:49 pm
Post
by Hades » Sat Jul 22, 2006 4:09 pm
Regarding the screen vs print problem... Why not use CSS to dictate different things when printed to whats on the screen and instead of using background colours you could have a separate graph shown using images for the bars. (1px x 1px shouldn't be too hard
)
deleet
Forum Commoner
Posts: 28 Joined: Thu Mar 23, 2006 10:05 am
Post
by deleet » Tue Aug 22, 2006 12:02 pm
Good job, I find this very very useful. Once again, good job and thank you !
the_last_tamurai
Forum Commoner
Posts: 87 Joined: Wed Feb 28, 2007 8:24 am
Location: cairo
Contact:
Post
by the_last_tamurai » Tue Mar 20, 2007 9:52 am
could I pass 2 arrays to the class to make bar chart of two compared bars per label???
Chris Corbyn
Breakbeat Nuttzer
Posts: 13098 Joined: Wed Mar 24, 2004 7:57 am
Location: Melbourne, Australia
Post
by Chris Corbyn » Tue Mar 20, 2007 11:24 am
Aaarrggghhh... My old stinky code keeps coming back to haunt me
No, this class wouldn't do that, it's pretty basic really. You could at best create a bigger array and alternate the bar colors.