RE: Little explorations with HP calculators (no Prime)
On a side note, recently I was trying to find a minimalist wallpaper with the German flag. My search skills did not help.
Since at the end a desktop wallpaper is a 2d image, I decided to attack the problem with some math, 50g and highcharts.js for plotting (or html5 canvas when things get rough, although highcharts.js is quite neat).
So far I got this, that for me is quite satisfying.
https://i.imgur.com/THesJyE.png
preview
the problem is that the canvas is pretty big, 3840 x 2880 and the points I used from a sine function are not much.
hp50g code
Code:
gpPlotSines
\<<
@remark: mode should be in degrees!
@ it uses listExt of DavidM
@Plan: see gpSlightlyRandomFunctions
@2017-10-28: amplitude, offset and highchart setup are important elements
@ that play together a role to let the graph be as you wish.
36 "lvIterations" DROP
10 "lvIncrementDegrees" DROP
2 "lvPeriods" DROP
{} "lvResultValues" DROP
1000 "lvAmplitude" DROP
1000000 "lvOffset" DROP
0 "lvStartingAngle" DROP
0 "lvElementsToPackInList" DROP
\->
lvIterations
lvIncrementDegrees
lvPeriods
lvResultValues
lvAmplitude
lvOffset
lvStartingAngle
lvElementsToPackInList
\<<
0 lvIterations 1 -
@ the sine is periodical so one does not necessarily need to compute it
@ all the time, if the computation returns always the same results.
@ because computing 1000 SINes is slow, about 613 seconds with the 50g.
@ while repeating the same block of 24 values, takes circa 3 seconds.
@ some big difference.
@ but this is complicated when the increment is not a divisor of 360,
@ so let's make it proper.
FOR lvIndex
lvStartingAngle lvIncrementDegrees lvIndex * +
SIN
@amplitude and offset
lvAmplitude *
@0 RND
IP
lvOffset +
@leave it on the stack
@and count
'lvElementsToPackInList' 1 STO+
NEXT
@pack the list of values
lvElementsToPackInList \->LIST
@not needed: 'lvResultValues' STO
gpConvertListToJsArray
\>>
\>>
gpConvertListToJsArray
\<<
@input a list
@transform in string
\->STR
@replace the string opening and closing with squared brackets
"{" "[" SREPL DROP
"}" "]" SREPL DROP
@replace the "." of the real numbers with no decimals (assuming integers)
"." "," SREPL
DROP @drop the number of replacements
\>>
gpConvertJsArrayToList
\<<
@input a string
@replace the string opening and closing with squared brackets
"[" "{" SREPL DROP
"]" "}" SREPL DROP
@replace the "," (assuming integers)
"," "." SREPL DROP
@transform from string
OBJ\->
\>>
highcharts.js code
Code:
<!DOCTYPE html>
<html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<title>Three functions german colors</title>
<!-- <script src="https://code.highcharts.com/highcharts.js"></script> -->
<script src="highcharts_6_0_2.js"></script>
<!-- <script src="https://code.highcharts.com/modules/exporting.js"></script> -->
<script src="highcharts_6_0_2_exporting.js"></script>
</head>
<body>
<!-- <div id="chart_div" style="min-width: 310px; height: 400px; margin: 0 auto"></div> -->
<!-- <div id="chart_div" style="width: 1920px; height: 1440px; margin: 0 auto"></div> -->
<div id="chart_div" style="width: 1920px; height: 1440px; margin: 0 auto"></div>
<script>
var container_element = document.getElementById("chart_div");
Highcharts.chart(container_element , {
title: {
text: null
},
subtitle: {
text: null
},
yAxis: {
visible: false,
min: 998500,
max: 1001000,
},
xAxis: {
visible: false,
min: 24, //quick way to leave data points in, but put them outside the graph.
},
chart: {
marginLeft: 0,
//backgroundColor: '#2bb71b',
//backgroundColor: '#3dce7c',
//backgroundColor: '#21a515',
//backgroundColor: '#53a34c',
backgroundColor: '#4156a3',
/*
backgroundColor: {
//top to bottom
linearGradient: {
x1: 0, y1: 0,
x2: 0, y2: 1,
},
stops: [
[0, '#e5e4e3'],
[1, '#6d6d6c'],
]
},
*/
},
/*
plotOptions: {
series: {
pointStart: 10
}
},
*/
legend: {
enabled: false,
},
series: [
{
name: null,
//black
color: '#000000',
lineWidth: 40,
marker: {
enabled : false,
},
visible: true,
enableMouseTracking: false,
index: 3,
// 999035 with amplitude 1000 and offset 1000000 is sin(75)
data: [ 999035, 999030, 999026, 999022, 999019, 999016, 999013, 999010, 999008, 999006,
999004, 999003, 999002, 999001, 999001, 999000, 999001, 999001, 999002, 999003, 999004, 999006,
999008, 999010, 999013, 999016, 999019, 999022, 999026, 999030, 999035, 999039, 999044, 999049,
999055, 999061, 999067, 999073, 999080, 999087, 999094, 999102, 999109, 999118, 999126, 999134,
999143, 999152, 999162, 999171, 999181, 999191, 999202, 999212, 999223, 999234, 999246, 999257,
999269, 999281, 999293, 999306, 999319, 999331, 999344, 999358, 999371, 999385, 999399, 999413,
999427, 999441, 999456, 999471, 999485, 999500, 999516, 999531, 999547, 999562, 999578, 999594,
999610, 999626, 999642, 999658, 999675, 999691, 999708, 999725, 999742, 999759, 999776, 999793,
999810, 999827, 999844, 999861, 999879, 999896, 999913, 999931, 999948, 999966, 999983, ]
},
{
name: null,
//red
color: '#f22121',
lineWidth: 40,
marker: {
enabled : false,
},
visible: true,
enableMouseTracking: false,
index: 2,
data: [ 999087, 999080, 999073, 999067, 999061, 999055, 999049, 999044, 999039, 999035,
999030, 999026, 999022, 999019, 999016, 999013, 999010, 999008, 999006, 999004, 999003, 999002,
999001, 999001, 999000, 999001, 999001, 999002, 999003, 999004, 999006, 999008, 999010, 999013,
999016, 999019, 999022, 999026, 999030, 999035, 999039, 999044, 999049, 999055, 999061, 999067,
999073, 999080, 999087, 999094, 999102, 999109, 999118, 999126, 999134, 999143, 999152, 999162,
999171, 999181, 999191, 999202, 999212, 999223, 999234, 999246, 999257, 999269, 999281, 999293,
999306, 999319, 999331, 999344, 999358, 999371, 999385, 999399, 999413, 999427, 999441, 999456,
999471, 999485, 999500, 999516, 999531, 999547, 999562, 999578, 999594, 999610, 999626, 999642,
999658, 999675, 999691, 999708, 999725, 999742, 999759, 999776, 999793, 999810, 999827, ]
},
{
name: null,
//gold
color: '#ffcf0f',
lineWidth: 40,
marker: {
enabled : false,
},
visible: true,
enableMouseTracking: false,
index: 1,
data: [ 999162, 999152, 999143, 999134, 999126, 999118, 999109, 999102, 999094, 999087,
999080, 999073, 999067, 999061, 999055, 999049, 999044, 999039, 999035, 999030, 999026, 999022,
999019, 999016, 999013, 999010, 999008, 999006, 999004, 999003, 999002, 999001, 999001, 999000,
999001, 999001, 999002, 999003, 999004, 999006, 999008, 999010, 999013, 999016, 999019, 999022,
999026, 999030, 999035, 999039, 999044, 999049, 999055, 999061, 999067, 999073, 999080, 999087,
999094, 999102, 999109, 999118, 999126, 999134, 999143, 999152, 999162, 999171, 999181, 999191,
999202, 999212, 999223, 999234, 999246, 999257, 999269, 999281, 999293, 999306, 999319, 999331,
999344, 999358, 999371, 999385, 999399, 999413, 999427, 999441, 999456, 999471, 999485, 999500,
999516, 999531, 999547, 999562, 999578, 999594, 999610, 999626, 999642, 999658, 999675, ]
},
],
});
</script>
</body>
</html>
Wikis are great, Contribute :)
|