Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8
  1. #1
    Senior Coder doubledee's Avatar
    Join Date
    Mar 2011
    Location
    Arizona
    Posts
    1,127
    Thanks
    27
    Thanked 0 Times in 0 Posts

    Creating Dynamic Graphs & Charts

    I would like to build an Online Survey Form where logged in Members can place a vote (e.g. Strong Disagree, Disagree, Indifferent, Agree, Strongly Agree) and then have a Histogram Chart which updates accordingly.

    Is there a way to build *dynamic* Graphs & Charts using PHP without having to code everything from scratch?

    (I'm sure you can buy proprietary software to do that, but that takes the fun out of building my own site. Plus I am broke!)

    I'm hoping there is some open-source stuff out there, or maybe some built in PHP Functions that at least does the graph drawing/plotting portion.

    Any suggestions?

    Thanks,


    Debbie

  • #2
    Senior Coder Len Whistler's Avatar
    Join Date
    Jul 2002
    Location
    Vancouver, BC Canada
    Posts
    1,323
    Thanks
    26
    Thanked 100 Times in 100 Posts
    One option is to use the html div tag with a fixed height and bg color then use php to set the width with info from the database. You can generate very nice bar charts with all sorts of colors that way.


    PHP Code:
    <?php
    $width_1
    ="200px";
    $width_2="150px";
    $width_3="423px";
    $width_4="175px";
    ?>

    <div style="width:<?php echo $width_1?>; height: 50px; background:#ff0000;"></div>
    <div style="width:<?php echo $width_2?>; height: 50px; background:#00ff00;"></div>
    <div style="width:<?php echo $width_3?>; height: 50px; background:#0000ff;"></div>
    <div style="width:<?php echo $width_4?>; height: 50px; background:#0ffff0;"></div>
    -------
    Last edited by Len Whistler; 07-28-2012 at 07:44 PM. Reason: Added php example
    Leonard Whistler

  • #3
    Super Moderator Inigoesdr's Avatar
    Join Date
    Mar 2007
    Location
    Florida, USA
    Posts
    3,647
    Thanks
    2
    Thanked 406 Times in 398 Posts
    I wouldn't use PHP to generate charts; it's slow and cumbersome to manipulate images. Use PHP/MySQL to store and retrieve the data and then use something like Highcharts, Fusion Charts, etc. to display it by passing the data you retrieve from the DB to your JavaScript code.

  • #4
    Senior Coder
    Join Date
    Sep 2010
    Posts
    2,246
    Thanks
    15
    Thanked 254 Times in 254 Posts
    But I use php to make charts, and other kinds of images. I use it in conjunction with the .svg filetype which is a type of XML document. It's plenty fast for that.

    http://www.w3schools.com/svg/svg_examples.asp

    Here's plenty of good examples, but I don't include it in the html like this, I embed an actual .svg file which is generated on the server. Then I make a download.php which converts the .svg file, using Imagemagick convert, to a .png, so people could make up their own chart, for example, and download it. I've also graphed continuous mathematical functions on the fly, so to speak, where the parameters of the function
    are uploaded via a form. It also does text, and if you upload an image to the server it can do text over image. It can even do Unicode text on the server, the only method I know that does it. So it's a powerful method and quite simple to learn.

  • #5
    Senior Coder doubledee's Avatar
    Join Date
    Mar 2011
    Location
    Arizona
    Posts
    1,127
    Thanks
    27
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Len Whistler View Post
    One option is to use the html div tag with a fixed height and bg color then use php to set the width with info from the database. You can generate very nice bar charts with all sorts of colors that way.


    PHP Code:
    <?php
    $width_1
    ="200px";
    $width_2="150px";
    $width_3="423px";
    $width_4="175px";
    ?>

    <div style="width:<?php echo $width_1?>; height: 50px; background:#ff0000;"></div>
    <div style="width:<?php echo $width_2?>; height: 50px; background:#00ff00;"></div>
    <div style="width:<?php echo $width_3?>; height: 50px; background:#0000ff;"></div>
    <div style="width:<?php echo $width_4?>; height: 50px; background:#0ffff0;"></div>
    -------
    But the problem is that what you are describing is the easy part.

    Creating the axes, scales, legends, etc would be a substantial amount of work if you did everything from scratch like you're saying!!!


    Debbie

  • #6
    Senior Coder doubledee's Avatar
    Join Date
    Mar 2011
    Location
    Arizona
    Posts
    1,127
    Thanks
    27
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Inigoesdr View Post
    I wouldn't use PHP to generate charts; it's slow and cumbersome to manipulate images. Use PHP/MySQL to store and retrieve the data and then use something like Highcharts, Fusion Charts, etc. to display it by passing the data you retrieve from the DB to your JavaScript code.
    Looks interesting, but I don't want to use JavaScript at this point, and more importantly, I don't want to use proprietary solutions.


    Debbie

  • #7
    Senior Coder
    Join Date
    Sep 2010
    Posts
    2,246
    Thanks
    15
    Thanked 254 Times in 254 Posts
    Quote Originally Posted by doubledee View Post
    Looks interesting, but I don't want to use JavaScript at this point, and more importantly, I don't want to use proprietary solutions.
    Debbie
    Google has some chart making software which is completely free, but if you don't want something like that, you may be able to search on the web for some free code. Yes, there is some coding involved in such a thing, but it's not the kind of thing that someone is likely to sit down and code just for you, especially since they may not know exactly what you want.

  • #8
    Senior Coder Len Whistler's Avatar
    Join Date
    Jul 2002
    Location
    Vancouver, BC Canada
    Posts
    1,323
    Thanks
    26
    Thanked 100 Times in 100 Posts
    Quote Originally Posted by doubledee View Post
    But the problem is that what you are describing is the easy part.

    Creating the axes, scales, legends, etc would be a substantial amount of work if you did everything from scratch like you're saying!!!


    Debbie
    Coding from scratch is the fun part. I added some math to take care of the scales, CSS can take care of the legends and overall look of the graph. I have included an image of what the code below will output.

    There is very little limitation in using PHP, MySQL, HTML, and CSS in your graph design.


    Fully working PHP demo code
    PHP Code:
    <?php

    // voting output from database
    $strongly_disagree=12;
    $disagree=7;
    $indifferent=7;
    $agree=17;
    $strongly_agree=34;

    $total_votes=77;
    $highest_vote=34;

    // php math for the graph scales, output is in percentage of highest vote
    $Strongly_Disagree round(($strongly_disagree $highest_vote) * 100);
    $Disagree round(($disagree $highest_vote) * 100);
    $Indifferent round(($indifferent $highest_vote) * 100);
    $Agree round(($agree $highest_vote) * 100);
    $Strongly_Agree round(($strongly_agree $highest_vote) * 100);

    // html output to webpage
    echo "<h1>$total_votes Total Votes</h1>";
    ?>
    <div style="width:600px">
    <div style="width:<?php echo $Strongly_Disagree?>%; height: 50px; background:#ff0000;">
    <?php echo $strongly_disagree?> Strongly Disagree</div>
    <div style="width:<?php echo $Disagree?>%; height: 50px; background:#ff9000;">
    <?php echo $disagree?> Disagree</div>
    <div style="width:<?php echo $Indifferent?>%; height: 50px; background:#fff000;">
    <?php echo $indifferent?> Indifferent</div>
    <div style="width:<?php echo $Agree?>%; height: 50px; background:#00ff00;">
    <?php echo $agree?> Agree</div>
    <div style="width:<?php echo $Strongly_Agree?>%; height: 50px; background:#009900;">
    <?php echo $strongly_agree?> Strongly Agree</div>
    </div>



    Last edited by Len Whistler; 07-29-2012 at 04:16 AM.
    Leonard Whistler


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •