웹 파이썬, 파이스크립트의 그래프와 바다 ASMR 유튜브
최근 ASMR 영상 만들기에 취미가 붙어 하나 더 만들어서 공유합니다.
시원한 파도소리를 들으며 내용 읽어보셔도 좋을것 같습니다 :)
https://www.youtube.com/watch?v=2rJyU7YKLyM
웹에서 실행하는 파이썬! 파이스크립트도 그래프를 그릴수 있습니다.
바로 넘파이(numpy)와 맷플롯 라이브러리를 이용한 방법인데요.
일부 내용만 제외하면 파이썬과 똑같습니다.
우선 전체 소스와 출력결과를 공개하도록 하겠습니다.
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>라이브러리 사용</title>
<!-- linking to PyScript assets -->
<link rel="stylesheet" href="https://pyscript.net/releases/2022.12.1/pyscript.css" />
<script defer src="https://pyscript.net/releases/2022.12.1/pyscript.js"></script>
</head>
<body>
<!-- display 명령에서 출력할 div -->
<div id="graph"></div>
<!-- 설치할 서드파티 -->
<py-config>
packages = ["numpy", "matplotlib"]
</py-config>
<py-script>
import numpy as np
import matplotlib.pyplot as plt
arr = np.array([5, 3, 4, 1, 2])
plt.plot(arr)
plt
display(plt, target="graph")
</py-script>
</body>
</html>
소스가 아주 간결하지요?
이 페이지는 크레이의 파이스크립트 홈페이지에서도 보실 수 있는데요.
http://py.dreamplan7.com/pyscript-book/?ex2
로딩하는데 시간이 소요됩니다.
그것은 실시간으로 사용자분의 컴퓨터에서 파이썬 엔진을 작동하기 때문이지요.
최근(2023. 10. 7 확인) 변경된 파이스크립트에 따르면, numpy 와 matplotlib 등과 같은 라이브러리를 사용하려면 패키징(packing)과 import 를 해주어야 하는데요. 그 방법이 변경되었습니다.먼저 HTML 태그에서 <py-config> 태그를 이용해 2개의 라이브러리를 패키징해주어야 합니다.
<py-config>
packages = ["numpy", "matplotlib"]
</py-config>라이브러리를 사용할 때는 파이썬과 사용법이 동일합니다.
import numpy as np
import matplotlib.pyplot as plt주목할 만한 점이 하나 더 있는데요.
파이썬과 다르게 그래프를 출력할 대상을 특정할 수 있다는 점입니다.
이를테면 HTML 태그로 아래와 같이 그래프를 그릴 대상을 정의하고
<div id="graph"></div>파이스크립트에서 결과를 출력할 때는 print 대신 display 명령을 사용하는 것입니다.
이 때 target 에 대상의 id값을 명시해 줍니다.
display(plt, target="graph")HTML 요소는 화면 어디에나 배치가 가능하므로 이로써 출력 결과를 자유롭게 화면 어디나 할 수 있는 장점이 있습니다.
웹에서의 파이썬, 바로 실행하여 누구에게나 보여줄 수 있는 파이스크립트의 색다른 매력이 흥미롭지 않으신가요? :)
오늘도 방문해주신 모든 분들께 감사드립니다. 그럼!
다음 게시글 : https://itadventure.tistory.com/638
웹 파이썬, 파이스크립트 비기[1] ( 실시간 모듈 설치 )
※ 이번 게시글은 난해한 내용을 포함하고 있습니다. 코딩 공부중이시면 이해하지 못해도 조금도 좌절 않으셔도 됩니다. 그냥 이런게 있구나 참고만 해주사고 복붙해 응용만 하셔도 상당히 잘
itadventure.tistory.com