Casio Python with fx-CG 50: Drawing Shapes with Casioplot (draws.py)

Casio Python with fx-CG 50: Drawing Shapes with Casioplot (draws.py)

The Casio file draws.py is a file that use both the casioplot and math modules and contains four drawing functions.

The plot functions uses the pixel system.

Upper left hand corner: (0, 0)	Upper right hand corner: (383, 0)
Lower left hand corner: (0, 191)	Lower right hand corner: (383, 191)

The x axis increases going right and the y axis increases going down. This orientation is common for a pixel-orientated coordinate system.

Note that the pixels must be integers. A non-integer value for a pixel will cause an error.

Importing the draws module

After copying the file draws.py to your calculator, type: from draws import *

The casioplot and math modules will also be imported because the draws module is imported. This is the case of the fx-CG 50, and I’m pretty sure it will work with the other Casio calculators with Python (fx-9750GIII, fx-9860GIII, fx-CG 100, Graph Math+).

To clear the drawing screen, use the casioplot’s command clear_screen().

To show the picture, use the casioplot’s command show_screen().

The functions from the draws must be manually typed, as they will not appear in the catalog or VARS menu.

sline(x,sx,y,sy,l,c)

Draws a line from (x,y) of length l and color c. The color is a three-element tuple in the RGB format ((red, green, blue)).

The arguments sx and sy are direction/slope arguments which dictate the direction of the line.

To draw a line going left (←)	Set sx = -1 and sy = 0
To draw a line going right (→)	Set sx = 1 and sy = 0
To draw a line going up (↑)	Set sx = 0 and sy = -1
To draw a line going down (↓)	Set sx = 0 and sy = 1
To draw a line going right and up (↗)	Set sx = 1 and sy = -1
To draw a line going left and up (↖)	Set sx = -1 and sy = -1
To draw a line going right and down (↘)	Set sx = 1 and sy = 1
To draw a line going left and down (↙)	Set sx = -1 and sy = 1

Examples:

sline(1,1,1,0,140,(255,0,0)) draws a red line starting from (1,1) going right with length of 140 pixels

sline(180,0,100,-1,50,(0,255,0)) draws a green line starting from (180,100) going up with length of 50 pixels

The sample file draw1.py is a demonstration of the sline command.

box(x,xl,y,yl,c)

The box function draws a box with the upper left hand corner (x,y) with color c, horizontal length (width) xl, and vertical length (height) yl. The box draws to the right and down. The box is filled with the specified color. If xl = yl, the function will draw a square.

Example:

box(20,100,40,150,(128,128,128)) draws a gray rectangle with upper-left corner at (20,40) with horizontal length of100 and vertical length of 150.

box(300,60,0,60,(0,0,0)) draws a black square with upper-left corner at (300, 0) with the side length of 60.

The sample file draw2.py uses the box function to generate a random game map of land (green) and water (blue).

tri(x,xd,y,yd,l,c)

The tri function draws a 45-45-90 right triangle. The point (x,y) is the corner point that contains the right angle of 90°. The arguments xd and yd dictate the direction of the triangle (see table below).

The triangle is filled with color c. The sides of the triangle will be drawn with length l.

Example:

tri(80,1,80,-1,75,(0,128,128)) draws a teal 45-45-90 right triangle with the right angle located at (80, 80). The length is 75 pixels.

The sample file draw3.py uses the tri function to draw four triangles, one with each proper orientation.

circ(x,y,r,c)

The circ function draws a circle centered at (x, y) with radius r and color c. The circle is drawn as outline and not filled. To make the circle appear as smooth as possible, 720 points are plotted.

Example:

circ(190,100,85,(255,128,0)) draws an orange circle with radius 85, centered at (190, 100).

The file draw4.py demonstrates the circ function.

Casio fx-CG 50 Python: draws.py code

# drawing utilities

# 12-04-2024

from casioplot import *

from math import *

def sline(x,sx,y,sy,l,c):

  for i in range(l+1):

    set_pixel(x+sx*i,y+sy*i,c)

# upper left corner

def box(x,xl,y,yl,c):

  for i in range(xl+1):

    for j in range(yl+1):

      set_pixel(x+i,y+j,c)

# right triangle

# (x,y) point with right angle

# l=length

# xd=1 right, xd=-1 left

# yd=1 down, yd=-1 up

def tri(x,xd,y,yd,l,c):

  for i in range(l+1):

    k=l-i

    for j in range(k+1):

      set_pixel(x+xd*i,y+yd*j,c)

# hallow circle

def circ(x,y,r,c):

for i in range(721):

  t=2*pi*i/720

  xr=int(x+r*cos(t))

  yr=int(y+r*sin(t))

  set_pixel(xr,yr,c)

You can download the draws.py and the example Python files here:

https://drive.google.com/file/d/1rGQHa60V7ZCE9Vs0kYy0cfIe0pOXqVaZ/view?usp=sharing

I hope you enjoy this program as much as I have making it,

Eddie

All original content copyright, © 2011-2025. Edward Shore. Unauthorized use and/or unauthorized distribution for commercial purposes without express and written permission from the author is strictly prohibited. This blog entry may be distributed for noncommercial purposes, provided that full credit is given to the author.

Converting a Line in Parametric Line to a Function Line

Converting a Line in Parametric Line to a Function Line 

From (x(t), y(t)) to y(x)

Express a line, presented in parametric form:

x = A * t + B

y = C * t + D

where A, B, C, and D are constants, and convert it to function form (y(x) or f(x)).

Here is one way to do this:

x = A * t + B

A * t = x - B

t = x / A - B / A

y = C * (x / A - B / A) + D

y = (C/A) * x - B*C/A + D

y = (C/A) * x + (D - B*C/A)

We know have a function in the slope-intercept form where:

slope = C/A

intercept = D - B*C/A

Casio fx-4000P Program:  Converting Parametric Lines to Functional Line

Size:  77 bytes

(line breaks added for readability)

"X=AT+B; A":

?→A:

"B":

?→B:

"Y=CT+D; C":

?→C:

"D":

?→D:

"SLOPE="⊿

C÷A→M⊿

"ITC="⊿

D-B×M→I

Examples

Graph screens are created by the Numworks emulator:  https://www.numworks.com/simulator/

Example 1:

x = 3 * t  - 4 

y = 2 * t + 8

A = 3, B = -4, C = 2, D = 8

Results:

SLOPE = 0.666666667

ITC = 10.66666667

Example 2:

x = -2 * t + 6

y = 4 * t + 3

A = -2, B = 6, C = 4, D = 3

Results:

SLOPE = -2

ITC = 15

Hope you find this useful.  Take care,

Eddie 

All original content copyright, © 2011-2022.  Edward Shore.   Unauthorized use and/or unauthorized distribution for commercial purposes without express and written permission from the author is strictly prohibited.  This blog entry may be distributed for noncommercial purposes, provided that full credit is given to the author. 

fx-260 Solar Algorithms Part I

fx-260 Solar Algorithms Part I

All results are shown to screen accuracy. 

Sphere:  Surface Area and Volume

With the radius r,
the surface area is S = 4 * π * r^2
the volume area is V = 4/3 * π * r^3

Algorithm:
r  [SHIFT] (Min) [ x² ] [ × ] [EXP](π) [ × ] 4 [ = ]    // surface area is displayed
[ × ] [ MR ] [ ÷ ] 3 [ = ]   // area is displayed

M = r

Example:
Input:
r = 3.86

Results:
3.86  [SHIFT] (Min) [ x² ] [ × ] [EXP](π) [ × ] 4 [ = ]   
Surface Area = 187.2338956

[ × ] [ MR ] [ ÷ ] 3 [ = ] 
Volume = 204.9076123

Monthly Payment of a Mortgage or Auto Loan

Input:
A = amount of the mortgage/loan
I = annual interest rate
N = number of months

The monthly payment can be found by:
PMT = ( 1 - (1 + I/1200)^-N) / (I/1200)

Algorithm:
I [ ÷ ] 1200 [ = ] [SHIFT] (Min)   // stores I/1200 into M
1 [ - ] [ ( ] 1 [ + ] [ MR ] [ ) ] [ x^y ] N [ +/- ] [ = ]
[SHIFT] (1/x) [ × ] [ MR ] [ × ] A [ = ]     // monthly payment

Example:
Input: 
I = 4  (4%)
N = 360
A = 85000

Result:
4 [ ÷ ] 1200 [ = ] [SHIFT] (Min)   // stores I/1200 into M
1 [ - ] [ ( ] 1 [ + ] [ MR ] [ ) ] [ x^y ] 360 [ +/- ] [ = ]
[SHIFT] (1/x) [ × ] [ MR ] [ × ] 85000 [ = ]     // monthly payment

PMT = 405.8030014   ($405.80)
(I/1200 = M = 3.333333333E-03)

Electromagnetic Field Strength 

Given the EIRP (effective isotropic radiated power) of a microwave (in Watts), we can calculate the following:

Power Flux Density: 
S = EIRP / (4 * π * d^2)   (W/m^2,  d = distance from the wave source in meters)

Electric Field:
E = √(30 * EIRP) /  d   (W/m)

Magnetic Field:
H = √(EIRP / (480 * π^2 * d^2) )  (A/m)

Algorithm:

Calculating Power Flux: 
EIRP [ ÷ ] [ ( ] 4 [ × ] [EXP](π) [ × ]  d [ x² ] [ ) ] [ = ]

Calculating Electric Field: 
[ ( ] EIRP [ × ] 30 [ ) ] [SHIFT] (√) [ ÷ ] 0.5 [ = ]

Calculating Magnetic Field:
[ ( ] EIRP [ ÷ ] [ ( ] 480 [ × ] [EXP](π) [ x² ] [ × ] d [ x² ] [ ) ] [ ) ] [ √ ] [ = ]

Example:
Input:
EIRP = 1800 W
d =  0.5 m   (distance)

Results:

Calculating Power Flux: 
1800 [ ÷ ] [ ( ] 4 [ × ] [EXP](π) [ × ]  0.5 [ x² ] [ ) ] [ = ]
Power Flux: 572.9577951 W/m^2

Calculating Electric Field: 
[ ( ] 1800 [ × ] 30 [ ) ] [SHIFT] (√) [ ÷ ] 0.5 [ = ]
Electric Field: 464.7580015 W/m

Calculating Magnetic Field:
[ ( ] 1800 [ ÷ ] [ ( ] 480 [ × ] [EXP](π) [ x² ] [ × ] 0.5  [ x² ] [ ) ] [ ) ] [ √ ] [ = ]
Magnetic Field: 1.232808888 A/m

Source:  Barue, Gerardo.  Microwave Engineering: Land & Space Radiocommunications John Wiley & Sons, Inc.  Hoboken, NJ  ISBN 978-0-470-08966-5 2008

Slope and Intercept with Two Points

Given two points of a line (x1, y1) and (x2, y2) we can find the slope (a) and y-intercept (b) of the general linear equation y = a*x + b.

The trick is to use the rectangular to polar conversion to find the slope:
θ = atan((y2 - y1)/(x2 -x1))
tan θ = (y2 - y1)/(x2 -x1) = slope = a

Once the slope is found, we can solve for the y-intercept:
y = a*x + b
b = y - a*x

Algorithm:
[ ( ] x1 [ - ] x2 [ ) ] [SHIFT] (R→P) [ ( ] y1 [ - ] y2 [ ) ] [ = ] [SHIFT] (X<>Y) [ tan ]
// slope is displayed

[ × ] x1* [ +/- ] [ + ] y1* [ = ]
// intercept is displayed

*x2 and y2 can be used instead

Example:
(x1, y1) = (8, 5.5)
(x2, y2) = (4, 9.5)

Result:
[ ( ] 8 [ - ] 4 [ ) ] [SHIFT] (R→P) [ ( ] 5.5 [ - ] 9.5 [ ) ] [ = ] [SHIFT] (X<>Y) [ tan ]

Slope: -1

[ × ] 8 [ +/- ] [ + ] 5.5 [ = ]

Slope: 13.5


Tomorrow will be Part II. 

Eddie

All original content copyright, © 2011-2019.  Edward Shore.   Unauthorized use and/or unauthorized distribution for commercial purposes without express and written permission from the author is strictly prohibited.  This blog entry may be distributed for noncommercial purposes, provided that full credit is given to the author.

HP Prime: Drawing 3D Lines and Boxes

HP Prime:  Drawing 3D Lines and Boxes

Introduction

I was sent an email from Carissa.  One of the questions was to explain the 3D features of LINE and TRIANGLE commands.  Confession:  I have never used to the 3D features of LINE and TRIANGLE before, time to learn something new.  Here is what I learned.


The Command LINE

In 3D drawing, you can connect as many points as you want.  In the most simple form, LINE takes three arguments:

*  Point Definition
*  Line Definition
*  Rotation Matrix

Point Definition

You define points of three dimensions (x, y, z) and if you want, a color.  The color attached to the point dominates any portion of the line that is nearest to the point.   The point definition is a nested list.

Syntax:  { {x, y, z, [color]}, {x, y, z, [color]}, {x, y, z, [color]}, ... }

Pay attention to the order you set your points.  Each point will be tied to an index.  For example, the first point in this list will have index 1, the second point in the list will have index 2, and so on.  Knowing the index number will be needed for the Line Definition.

Line Definition

This is where you assign which lines connect to which points.

Syntax:  { {index start, index end, [color], [alpha]}, {index start, index end, [color], [alpha]}, {index start, index end, [color], [alpha]},  ... }

Like the Point Definition, the Line Definition is a nested list.  You can make as many points as you want. 

Color and alpha in the List Definition overrides any color defined in the Point Definition list.

Rotation Matrix

This tells you the command how you want to rotate the matrix with the respect to the x, y, and z axis, respectively.  The acceptable size for the matrix is 2 x 2 (for x and y only), 3 x 3 (x, y, and z axis) and 3 x 4 (I'm not sure what the fourth column is for).  For this blog entry and in practice, I use the 3 x 3 rotation matrix.

In general:

Rx = [ [1, 0, 0],[0 cos a, -sin a],[0, sin a, cos a] ], rotation about the x axis at angle a
Ry = [ [cos b, 0, -sin b], [0, 1, 0], [sin b, 0, cos b ] ], rotation about the y axis at angle b
Rz = [ [cos c, -sin c, 0], [sin c, cos c, 0], [0, 0, 1] ], rotation about the z axis at angle c

Full Rotation matrix: r = Rx * Ry * Rz

You can create a program to calculate rotation matrix or copy the syntax to use in your drawing program, as shown here:

HP Program ROTMATRIX

EXPORT ROTMATRIX(a,b,c)
BEGIN
// rotate x axis
// rotate y axis
// rotate z axis
LOCAL x,y,z,r; 

x:=[[1,0,0],[0,COS(a),−SIN(a)],
[0,SIN(a),COS(a)]];
y:=[[COS(b),0,−SIN(b)],[0,1,0],
[SIN(b),0,COS(b)]];
z:=[[COS(c),−SIN(c),0],
[SIN(c),COS(c),0],[0,0,1]];
r:=x*y*z;

RETURN r;

END;

Drawing the Boxes

HP Prime Program:  DRAWBOX

The program DRAWBOX draws a simple box. 

EXPORT DRAWBOX()
BEGIN
// 3D line demo
// draw still box demo 
// 2019-04-23 EWS

// black background
RECT(0);

// colors - do this first
LOCAL c1:=#FFFF00h; // yellow
LOCAL c2:=#39FF14h; // neon green
LOCAL c3:=#FFFFFFh; // white


// points of the cube
LOCAL p:={{−3,0,0,c1},{0,−2,2,c1},
{3,0,0,c1},{0,2,−2,c2},
{−3,6,0,c1},{0,4,2,c1},
{3,6,0,c1},{0,8,−2,c2}};


// line definitions
// bottom
LOCAL d1:={{1,2},{2,3},
{3,4},{4,1}};
// top
LOCAL d2:={{5,6},{6,7},
{7,8},{8,5}};
// sides, override with white
LOCAL d3:={{1,5,c3},{2,6,c3},
{4,8,c3},{3,7,c3}};

// rotation matrix
LOCAL r:=[[1,0,0],[0,1,0],
[0,0,1]];

LINE(p,d1,r);
LINE(p,d2,r);
LINE(p,d3,r);

WAIT(0);

END;


HP Prime Program: DRAWBOX2

DRAWBOX2 takes three arguments, rotation of the x axis, rotation of the y axis, and rotation of the z axis.  The arguments are entered in degrees, as the calculator is set to Degrees mode in the program.

EXPORT DRAWBOX2(a,b,c)
BEGIN
// 3D line demo
// draw 3D box
// 2019-04-23 EWS
// rotate the cube

// set degrees mode
HAngle:=1;

// rotation calculation
// rotate x axis
// rotate y axis
// rotate z axis
LOCAL x,y,z,r; 

x:=[[1,0,0],[0,COS(a),−SIN(a)],
[0,SIN(a),COS(a)]];
y:=[[COS(b),0,−SIN(b)],[0,1,0],
[SIN(b),0,COS(b)]];
z:=[[COS(c),−SIN(c),0],
[SIN(c),COS(c),0],[0,0,1]];
r:=x*y*z;

// black background
RECT(0);

// colors - do this first
LOCAL c1:=#FFFF00h; // yellow
LOCAL c2:=#39FF14h; // neon green
LOCAL c3:=#FFFFFFh; // white


// points of the cube
LOCAL p:={{−3,0,0,c1},{0,−2,2,c1},
{3,0,0,c1},{0,2,−2,c2},
{−3,6,0,c1},{0,4,2,c1},
{3,6,0,c1},{0,8,−2,c2}};


// line definitions
// bottom
LOCAL d1:={{1,2},{2,3},
{3,4},{4,1}};
// top
LOCAL d2:={{5,6},{6,7},
{7,8},{8,5}};
// sides, override with white
LOCAL d3:={{1,5,c3},{2,6,c3},
{4,8,c3},{3,7,c3}};

// rotation matrix is already
// defined

LINE(p,d1,r);
LINE(p,d2,r);
LINE(p,d3,r);

WAIT(0);

END;

3D Triangles

The format for TRIANGLE is similar except the definition list has three points to make up the triangle instead of two. Format: {x, y, z, [ c ]}

Code:

EXPORT TEST6241()
BEGIN
// test 3D triangle
RECT_P();

//TRIANGLE({0,0,#0h,0},
//{2,2,#0000FFh,39},
//{1,5,#FF0000h,−2});

LOCAL c:=#400080h;
LOCAL p:={{0,0,0},{−10,−8,2},
{−6,4,3},{0,0,0}};
LOCAL d:={{1,2,3,c},{1,2,4,c},
{1,3,4,c},{2,3,4,c}};
local rotmat= [[1, .5, 0], [.5, 1, .5], [0, .5, 1]];   // Initial rotation matrix. No rotation but translate to middle of screen 
TRIANGLE(p,d,rotmat);

WAIT(0);
END;

Hope this helps and all of our drawing capabilities on the HP Prime are expanded.  Carissa, thank you for your email, much appreciated and I learned a great new skill.  All the best!

Eddie

All original content copyright, © 2011-2019.  Edward Shore.   Unauthorized use and/or unauthorized distribution for commercial purposes without express and written permission from the author is strictly prohibited.  This blog entry may be distributed for noncommercial purposes, provided that full credit is given to the author.

HP Prime Programming Tutorial #8: ARC, LINE, and Placement of Graphics

Welcome to Part 8 of the HP Prime Tutorial. Continuing in our drawing commands, we are going to feature ARC and LINE.

ARC and ARC_P: Draws a Circle or a Circular Arc

Syntax:

Cartesian:
ARC(x, y, r, angle 1*, angle 2*, color*).

Pixels:
ARC_P(x, y, r, angle 1*, angle 2*, color*)

x: x coordinate

y: y coordinate

r: length of the radius in pixels. This is why I prefer using pixel commands in my programming.

angle 1 and angle 2: If included, these two arguments draw an arc segment. The angle follows the conventional circle notation, starting with 0 (due east) going counter clockwise. Use the current angle mode.

color: color of the arc. To use it, angle 1 and angle 2 must be included.

LINE and LINE_P

Draws a line segment from (x1, y1) to (x2, y2). The color is optional.

Syntax:

Cartesian:
LINE(x1, y1, x2, y2, color*)

Pixels:
LINE_P(x1, y1, x2, y2, color*)

The next to programs CIRCLE1 and CIRCLE2 do the same thing: draw a circle, label quadrants and angels. The reason why I am posting these two is that when you are programming graphics, care must be given. Adjustments to where graphics are placed can be necessary and I hope CIRCLE1 and CIRCLE2 illustrates this.

Medium font is assumed (set in Home Settings).

The angle symbol (°) get be retrieved by pressing Shift + 9 and selecting ° from the grid.

CIRCLE1 (the "rough draft", if you will):

EXPORT CIRCLE1()
BEGIN
RECT();
TEXTOUT_P("Circle", 0, 0);
TEXTOUT_P("II",109,59);
TEXTOUT_P("90°",159,59);
TEXTOUT_P("I",209,59);
TEXTOUT_P("180°",109,109);
TEXTOUT_P("0°",209,109);
TEXTOUT_P("III",109,159);
TEXTOUT_P("270°",159,159);
TEXTOUT_P("IV",209,159);

LINE_P(0,109,318,109,RGB(16,16,16));
LINE_P(159,0,159,239,RGB(16,16,16));

ARC_P(159,109,30);
FREEZE;
END;

The results:

This is good, but we can do better. First I am going to move the labels II, 180°, and III 10 pixels to the left, primarily so the 180° label does not touch the circle.

Second I am going to move the labels III, 270°, and IV up 10 pixels to make the bottom line look better and not "so far away" from the circle.

Although it is not necessarily, I am going to make the angle labels blue. I will need to specify the font size code at 0.

Finally, I find that the lines are too dark. I am going to make them a bit more gray.

Here is the second revision. For the purposes of this tutorial, I call this program CIRCLE2. All changes are in bold.

EXPORT CIRCLE1()
BEGIN
RECT();
TEXTOUT_P("Circle", 0, 0);
TEXTOUT_P("II",99,59);
TEXTOUT_P("90°",159,59,0,RGB(0,0,255));
TEXTOUT_P("I",209,59);
TEXTOUT_P("180°",99,109,0,RGB(0,0,255));
TEXTOUT_P("0°",209,109,0,RGB(0,0,255));
TEXTOUT_P("III",99,149);
TEXTOUT_P("270°",159,149,0,RGB(0,0,255));
TEXTOUT_P("IV",209,149);

LINE_P(0,109,318,109,RGB(128,128,128));
LINE_P(159,0,159,239,RGB(128,128,128));

ARC_P(159,109,30);
FREEZE;
END;

A better looking picture.

As always, thanks for your time, comments, and questions. Hopefully this session is helpful.


This blog is property of Edward Shore. 2013


Eddie

** Note: Thanks to Dennis for pointing out my typo.  It is corrected now.  3/5/2014