i'm trying to echo this
echo $row['positionX'] . " " . $row['positionY'];
as polygone points in a svg graphic code snippet
<polyline points = "...HERE..." fill = "none" stroke = "blue" stroke-width = "3"/>
how do i that?
thanks
There are other ways, depending on requirements or coding style:-
$.getJSON(....) jQuery method where the server echo json_decode($row);, then dynamically draw the polyline from JSON data (eg: RaphaelJS or SnapSVG saves you a bit of coding)
echo "<polyline points=\"$row['positionX'],$row['positionX']\" \/>";
For Single Page Application, use #1 since it is an AJAX call.
For a one time page load, #2 coding is simple enough.
Note: too many <?php echo in a HTML is hard to debug, also recommend moustache templating to help readability and code simplification.
Something like this?
<polyline points = "<?php echo $row['positionX'] . " " . $row['positionY']; ?>" fill = "none" stroke = "blue" stroke-width = "3"/>
Related
I've got a a-tag dynamically populated which extracts data from a database and multiplies to the number of records existing. So this to be looked at more like an item in a list.
echo "<a class='Keylist ".$wecb_color."' id='myIDhere' href='index.php?idd=".$record['categoryid']."'><div>".$record['descriptor']."</div></a>";
I'm trying to keep one of the a-tags background set on a different color when a user clicks. Behavior I'm trying to achieve is when a user scrolls and clicked on one link, that a-tag to remain selected depicting a different background color.
I've written snippet trying to do that.
$wecb_color ='';
if(isset($_GET['idd'])){
$_SESSION['link'] = $_GET['idd'];
echo "<br><br><br><br><br>".$_SESSION['link'];
if($_GET['idd'] == $_SESSION ['link']) {
$wecb_color = 'changetogreen';
}
}
The issue is this makes all the a-tag's which are generated having a background color changed to green instead the one that user clicks.
Hard coded CSS script reads as :- .changetogreen{background-color: green;}
Any thoughts appreciated.
It'd change the background color of all links because you're changing the whole class style.
Try this:
echo "<a class='"Keylist " style=" '.$wecb_style.' ;" id='myIDhere' href='index.php?idd=".$record['categoryid']."'><div>".$record['descriptor']."</div></a>";
So you can change the style of particular tag.
And PHP would be:
$wecb_style ='';
if(isset($_GET['idd'])){
$_SESSION['link'] = $_GET['idd'];
echo "<br><br><br><br><br>".$_SESSION['link'];
if($_GET['idd'] == $_SESSION ['link']) {
$wecb_style = 'background: green';
}
}
I try to use the right axis of TeeChart for PHP. I'm aware that we need to link a valid serie to both vertical axis. In fact, I have tried a simple test with the custom axis demo on the Steema site. I cut and pasted the demo and try to export it to javascript instead of rendering it.
I used this code to export to javascript :
echo $tChart1->getChart()->getExport()->getImage()->getJavaScript()->Render()->toString();
Here is a snapshot of the 2 renders side-by-side (sorry to put it in a link, this forum don't allow me to post pictures yet...)
Is there a way to get the right axis to show with the export?
EDIT:
Here is the code to test on your side :
<?php
//Includes
include "../../../sources/TChart.php";
$chart1 = new TChart(600,450);
$chart1->getChart()->getHeader()->setText("Custom Axes Demo");
$chart1->getAspect()->setView3D(false);
$line1 = new Line($chart1->getChart());
$line2 = new Line($chart1->getChart());
$line1->setColor(Color::RED());
$line2->setColor(Color::GREEN());
$chart1->addSeries($line1);
$chart1->addSeries($line2);
// Speed optimization
$chart1->getChart()->setAutoRepaint(false);
for($t = 0; $t <= 10; ++$t) {
$line1->addXY($t, (10 + $t), Color::RED());
if($t > 1) {
$line2->addXY($t, $t, Color::GREEN());
}
}
$chart1->getAxes()->getLeft()->setStartPosition(0);
$chart1->getAxes()->getLeft()->setEndPosition(50);
$chart1->getAxes()->getLeft()->getAxisPen()->color = Color::RED();
$chart1->getAxes()->getLeft()->getTitle()->getFont()->setColor(Color::RED());
$chart1->getAxes()->getLeft()->getTitle()->getFont()->setBold(true);
$chart1->getAxes()->getLeft()->getTitle()->setText("1st Left Axis");
$chart1->getAxes()->getTop()->getLabels()->setAngle(45);
$chart1->getAxes()->getTop()->getTitle()->getFont()->setColor(Color::YELLOW());
$chart1->getAxes()->getTop()->getTitle()->getFont()->setBold(true);
$chart1->getAxes()->getBottom()->getLabels()->setAngle(0);
$chart1->getAxes()->getRight()->getLabels()->setAngle(45);
$chart1->getAxes()->getBottom()->getTitle()->getFont()->setColor(new Color(255,25,25));
$chart1->getAxes()->getBottom()->getTitle()->getFont()->setBold(true);
$chart1->getAxes()->getRight()->getTitle()->getFont()->setColor(Color::BLUE());
$chart1->getAxes()->getRight()->getTitle()->getFont()->setBold(true);
$chart1->getAxes()->getRight()->getTitle()->setText("OtherSide Axis");
$chart1->getAxes()->getRight()->getLabels()->getFont()->setColor(Color::BLUE());
$chart1->getAxes()->getRight()->getAxisPen()->setColor(Color::BLUE());
$chart1->getAxes()->getTop()->getTitle()->setText("Top Axis");
$chart1->getAxes()->getBottom()->getTitle()->setText("Bottom Axis");
$line1->setHorizontalAxis(HorizontalAxis::$BOTH);
$line1->setVerticalAxis(VerticalAxis::$BOTH);
$axis1 = new Axis(false, false, $chart1->getChart());
$chart1->getAxes()->getCustom()->add($axis1);
$line2->setCustomVertAxis($axis1);
$axis1->setStartPosition(50);
$axis1->setEndPosition(100);
$axis1->getTitle()->getFont()->setColor(Color::GREEN());
$axis1->getTitle()->getFont()->setBold(true);
$axis1->getTitle()->setText("Extra Axis");
$axis1->getTitle()->setAngle(90);
$axis1->setRelativePosition(20);
$axis1->getAxisPen()->setColor(Color::GREEN());
$axis1->getGrid()->setVisible(false);
echo $tChart1->getChart()->getExport()->getImage()->getJavaScript()->Render()->toString();?>
I've modified the end of your test page to show both the HTML5 and the PHP charts at the same page:
echo $chart1->getChart()->getExport()->getImage()->getJavaScript()->Render()->toString();
$chart1->render("chart1.png");
$rand=rand();
print '<img src="chart1.png?rand='.$rand.'">';
Then, I've modified TeeChart PHP sources to also export the custom axes and the assign.
It now looks like this:
Please, send a mail to "info#steema.com" and we'll send you the modified unit (JavaScriptExport.php).
I am trying to create a CSS Pie Chart script that will display three sets of results every time, every time these results appear, they will be different. i.e I am using different pie charts across the site that will display different information.
I want to know how I would do this, I have managed to write the PHP that will give my 3 sections rotate starts and total values of each segment, but actually implementing the rest of the pie chat is quite hard.
PHP for determining size of each area and it's total rotation:
<?php
$T1 = $degree['UFIRST'];
$T2 = $degree['UUPPER'];
$T3 = $degree['ULOWER'];
$TotalTs = $T1 + $T2 + $T3;
$PieTotal = 360 / $TotalTs;
// AREA OF SLICES %'s
$Slice1 = $T1 * $PieTotal;
$Slice2 = $T2 * $PieTotal;
$Slice3 = $T3 * $PieTotal;
// ROTATION %'s
$StartSlice1 = 0;
$StartSlice2 = $Slice1 + $StartSlice1;
$StartSlice3 = $StartSlice2 + $Slice2;
?>
This is my HTML for each segment:
<div class="pie" data-start="0" data-value="<?php echo $Slice1 ?>"></div>
<div class="pie" data-start="<?php echo $StartSlice2 ?>" data-value="<?php echo $Slice2 ?>"></div>
<div class="pie" data-start="<?php echo $StartSlice3 ?>" data-value="<?php echo $Slice3 ?>"></div>
All of this is correct and works, however I don't know where to start with writting the CSS for this, as I don't wish for it to be a static pie chart.
Any ideas/help is greatly appreciated.
Please no links or mention to jQuery examples as I wish to avoid this as much as possible.
I would reccomend using Google Charts API, as it is relatively simple to implement but it requires Java Script.
Another option is to use plain CSS charts based on circles and their sectors which an example of can be found here
Well on of the best charts are jquery if you want to write it yourself you should post at least what you have so far.If you want them be dynamic you want to use js, even for static you still need to use js.Bcs entering manually css value through php is just meh.
I have a page that allows the user to draw an image using HTML5 canvas, convert it into text with JavaScript and post it to a PHP page.
http://dsiextensions.co.cc/chatdraw.php
The page is quite confusing, each text box is for each line of to 100px X 100px canvas. To put the data in the boxes, click "Finish" and then click "Submit" (Sorry that it's really slow).
I've tries making changes to the PHP code and occasionally the variable turns up but more often than not, it doesn't.
Here's the code: (note, only the data in the first box is used at the moment)
<?php
$dstring = $_POST['senddata1'];
$darray = str_split($dstring);
echo $dstring;
print_r($darray);
$x=1;
$y=1;
for ($a=0;$a<100;$a++)
{
if($a%100==0 && $a!=0){
echo '<br />'; //Checks if it is the 100th pixel and adds a new line (not needed at the moment)
$y++;
$x=1;}
//echo $x . ',' . $y . '(' . $a . ',' . $darray[$a] . ')|';
if($darray[$a]!=0){
echo "<input type='button' style='width:15;height:15;background-color:#000' />"; //Black button if it is a black pixel
}
else{
echo "<input type='button' style='width:15;height:15;background-color:#fff' />"; //White button if it is a white pixel
}
$x++;
}
?>
The codes supposed to check if the pixel is black or white and create a coloured button based on that (I'm going to use the image functions later), however $dstring is never echoed and therefore can't be converted to an array. Is there something I'm doing wrong here or is it a server problem?
Thanks
Note that the second PHP line should be spread out on to three lines
Seems to work by my side. Are you sure that data is well posted ? Try to make a print_r($_POST); in your script to see what has been posted
Php can detect IP, hostname, client agent etc. Can php detect client browser monitor size/resolution?
No, it cant. PHP runs on the server, so it cant detect client settings unless you take specific client-side steps to pass the info to the PHP scripts on the server.
Please do note that some of us like our browsers non-maximized. Perhaps you'd be better off trying to detect browser size rather than screen resolution. I assume that the JS to do either would be very similar, but I don't actually know that to be the case.
Also, what is the resolution of a blind man's screen reader?
You'll have to use PHP together with JavaScript, like in this example:
$url = $_SERVER['PHP_SELF'];
if( isset($HTTP_COOKIE_VARS["res"]) )
$res = $HTTP_COOKIE_VARS["res"];
else {
?>
<script language="javascript">
<!--
go();
function go()
{
var today = new Date();
var the_date = new Date("August 31, 2020");
var the_cookie_date = the_date.toGMTString();
var the_cookie = "res="+ screen.width +"x"+ screen.height;
var the_cookie = the_cookie + ";expires=" + the_cookie_date;
document.cookie=the_cookie
location = '<?echo "$url";?>';
}
//-->
</script>
<?php
}
//Let's "split" the resolution results into two variables
list($width, $height) = split('[x]', $res);
//Take the width and height minus 300
$tb_width = $width-300;
$tb_height = $height-300;
//Make the table
print("<table align=center border=1 width=" .$tb_width . " height=" . $tb_height . " >
<tr><td align=center>Your screen resolution is " . $width . " by " . $height . ".<br>
The width/height of this table is " . $tb_width . " by " . $tb_height . ".</td></tr>
</table>");
I was looking for this as well, but found none of these answers really answered the question! Indeed, there is no way for PHP to know the screen resolution since it is running on the server side. Since that information is not passed along in HTTP environment variables, we need another route. Javascript is one alternative.
The example below is a PHP page that checks for a resolution variable being passed in the HTTP request. If it does not find that resolution variable, then it creates a brief bit of JavaScript on the page that passes that variable and the height and width along in a redirect back to itself. Of course, when the page is loaded again after the redirect all the variables will be set and PHP will know the resolution.
<?php
if(!isset($_GET['resolution'])) {
echo "<script language=\"JavaScript\">
<!--
document.location=\"$PHP_SELF?resolution=1&width=\"+screen.width+\"&height=\"+screen.height;
//-->
</script>";
} else {
// Code to be displayed if resolution is detected
if(isset($_GET['width']) && isset($_GET['height'])) {
echo "Width: " . $_GET['width'] . " and Height: " . $_GET['height'] . "<br />";
} else {
echo "Resolution not detected.";
}
}
?>
In the end I found this a pretty unsatisfactory solution. It works, but it is ugly, adding cruft to the URL and requiring a redirect. Still, it may inspire someone to post a better answer. FYI, credit where credit is due, this answer was inspired by this post.
I know this is not the best answer so spare the downvote.
<script>
/*
JAVASCRIPT IS ON TELL THE DEVELOPER#
*/
// GET BROWSER WIDTH AND HEIGHT
var bh=screen.height;
var bw=screen.width;
window.location="?doSubmit=do&js=yes&bh="+bh+"&bw="+bw+"";
</script>
<noscript>
<!--
JAVASCRIPT IS OFF TELL THE DEVELOPER#
-->
<meta http-equiv='refresh' content='0;url=?doSubmit=do&js=off&bh=off&bw=off'>
</noscript>
<?
if($_GET["doSubmit"]=="do"){
// VARS
$bh=$_GET["bh"];
$bw=$_GET["bw"];
$js=$_GET["js"];
// PRINT HTML ?>
<table>
<tr><td><strong>Browser Width:</strong></td><td><?=$bw;?>px</tr>
<tr><td><strong>Browser Height:</strong></td><td><?=$bh;?>px</tr>
<tr><td><strong>JavaScript Detection (y/n):</strong></td><td><?=$js;?></tr>
</table>
Some people require browser size for mobile devoloping. This is essential information in some cases.
Using WURFL and WALL can get around this as most mobiles do not support JS.
Monitor size can't be obtained using JS, you have to make a poll :)
Note, that JS can check the window size of browser, but this size includes user toolbars, scrollbars etc... Real workspase area in browser depends on those toolbars size.