JavaScript: Leaning JavaScript by creating charts with Plotly, pyscript ver. 1

Last Updated on June 18, 2022 by shibatau

I. Creating charts and learning the Javascript basics

You can create beautiful charts with Plotly very easily using CodePen.

See the Pen
simpleBar
by shibatau (@shibatau)
on CodePen.

You can see more samples here:

https://plotly.com/javascript/

II. Attendance

I have created a bar charts for the Attendances of my classes.

See the Pen
2022attendance_9
by shibatau (@shibatau)
on CodePen.

III. Using PyScript

PyScript is a framework that allows users to create rich Python applications in the browser using HTML’s interface and the power of PyodideWASM, and modern web technologies. The PyScript framework provides users at every experience level with access to an expressive, easy-to-learn programming language with countless applications.

Run Python in Your HTML

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>HTML 5 Boilerplate</title>
    <link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
    <script defer src="https://pyscript.net/alpha/pyscript.js"></script>

    <py-env>
      - numpy
      - matplotlib
    </py-env>
  </head>

<body>
	<p id="demo"></p>=
  <div id="plot"></div>
  <py-script output="plot">
import matplotlib.pyplot as plt
import numpy as np
data = {'Basic English':90.74, 'Computer English':93.43, 'English Communication':88.3,
        'Local Welfare':92.98}
courses = list(data.keys())
values = list(data.values())
  
fig = plt.figure(figsize = (10, 5))
 
# creating the bar plot
plt.bar(courses, values, width = 0.4)
plt 
    </py-script>
  </body>
</html>

See the Pen
pyscriptAttendance
by shibatau (@shibatau)
on CodePen.

To be continued.

About shibatau

I was born and grown up in Kyoto. I studied western philosophy at the University and specialized in analytic philosophy, especially Ludwig Wittgenstein at the postgraduate school. I'm interested in new technology, especially machine learning and have been learning R language for two years and began to learn Python last summer. Listening toParamore, Sia, Amazarashi and MIyuki Nakajima. Favorite movies I've recently seen: "FREEHELD". Favorite actors and actresses: Anthony Hopkins, Denzel Washington, Ellen Page, Meryl Streep, Mia Wasikowska and Robert DeNiro. Favorite books: Fyodor Mikhailovich Dostoyevsky, "The Karamazov Brothers", Shinran, "Lamentations of Divergences". Favorite phrase: Salvation by Faith. Twitter: @shibatau

Leave a Reply

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.