|
|
<!doctype html> |
|
|
<html> |
|
|
<head> |
|
|
<title id="header-title">Pandas</title> |
|
|
<meta charset="utf-8" /> |
|
|
<meta name="viewport" content="width=device-width,initial-scale=1" /> |
|
|
<link rel="icon" type="image/png" href="./favicon.png" /> |
|
|
<link |
|
|
rel="stylesheet" |
|
|
href="https://pyscript.net/latest/pyscript.css" |
|
|
/> |
|
|
<script defer src="https://pyscript.net/latest/pyscript.js"></script> |
|
|
|
|
|
<link rel="stylesheet" href="./assets/css/examples.css" /> |
|
|
</head> |
|
|
|
|
|
<body> |
|
|
<nav class="navbar" style="background-color: #000000"> |
|
|
<div class="app-header"> |
|
|
<a href="/"> |
|
|
<img src="./logo.png" class="logo" /> |
|
|
</a> |
|
|
<a |
|
|
class="title" |
|
|
id="page-title" |
|
|
href="" |
|
|
style="color: #f0ab3c" |
|
|
></a> |
|
|
</div> |
|
|
</nav> |
|
|
|
|
|
<br /> |
|
|
<div id="page-message"></div> |
|
|
|
|
|
<div id="pandas-source"> |
|
|
<h3>Data Source</h3> |
|
|
<input type="text" id="txt-url" class="py-input" size="70" /> |
|
|
<button |
|
|
type="submit" |
|
|
id="btn-load" |
|
|
class="py-button" |
|
|
py-click="loadFromURL()" |
|
|
> |
|
|
Load CSV |
|
|
</button> |
|
|
</div> |
|
|
|
|
|
<div id="pandas-repl" hidden> |
|
|
<h3>Python REPL</h3> |
|
|
<py-repl id="pandas-repl-inner" output="pandas-output-inner"> |
|
|
# Hit SHIFT + ENTER to execute example code # Get all closed |
|
|
airports in Great Britain df2 = df.query("type == 'closed' & |
|
|
iso_country == 'GB'") df2 |
|
|
</py-repl> |
|
|
</div> |
|
|
|
|
|
<div id="pandas-output" hidden> |
|
|
<h3>Output</h3> |
|
|
<div id="pandas-output-inner"></div> |
|
|
</div> |
|
|
|
|
|
<div id="pandas-dev-console" hidden> |
|
|
<h3>Dev Console</h3> |
|
|
<py-terminal auto></py-terminal> |
|
|
</div> |
|
|
|
|
|
<py-tutor> |
|
|
<py-config> |
|
|
plugins = [ |
|
|
"https://pyscript.net/latest/plugins/python/py_tutor.py" |
|
|
] |
|
|
packages = ["pandas"] |
|
|
</py-config> |
|
|
|
|
|
<section class="pyscript"> |
|
|
<py-script> |
|
|
import pandas as pd |
|
|
from pyodide.http import open_url |
|
|
import sys |
|
|
|
|
|
title = "Pandas (and basic DOM manipulation)" |
|
|
page_message = "This example loads a remote CSV file into a Pandas dataframe, displays it and lets you manipulate it through a Python REPL" |
|
|
|
|
|
url = "https://raw.githubusercontent.com/datasets/airport-codes/master/data/airport-codes.csv" |
|
|
|
|
|
Element("header-title").element.innerText = title |
|
|
Element("page-title").element.innerText = title |
|
|
Element("page-message").element.innerText = page_message |
|
|
|
|
|
Element("txt-url").element.value = url |
|
|
|
|
|
# Depending on the type of DOM element, there are several alternative methods to write to it |
|
|
# Element("id-of-dom-element").write("example") |
|
|
# Element("id-of-dom-element").innerText = "example" |
|
|
# Element("id-of-dom-element").value = "example" |
|
|
# Element("id-of-dom-element").element.innerText = "example" |
|
|
# Element("id-of-dom-element").element.value = "example" |
|
|
# js.document.getElementById("id-of-dom-element").innerText = "example" |
|
|
# js.document.getElementById("id-of-dom-element").value = "example" |
|
|
|
|
|
df = pd.DataFrame() |
|
|
|
|
|
|
|
|
def loadFromURL(*args, **kws): |
|
|
global df |
|
|
|
|
|
# clear dataframe & output |
|
|
df = pd.DataFrame() |
|
|
Element("pandas-output-inner").element.innerHTML = "" |
|
|
|
|
|
url = Element("txt-url").element.value |
|
|
log ("Trying to fetch CSV from " + url) |
|
|
|
|
|
df = pd.read_csv(open_url(url)) |
|
|
|
|
|
Element("pandas-repl").element.style.display = "block" |
|
|
Element("pandas-output").element.style.display = "block" |
|
|
Element("pandas-dev-console").element.style.display = "block" |
|
|
|
|
|
display (df, target="pandas-output-inner", append="False") |
|
|
|
|
|
def log(message): |
|
|
# log to pyscript dev console |
|
|
print (message) |
|
|
|
|
|
# log to JS console |
|
|
js.console.log (message) |
|
|
</py-script> |
|
|
</section> |
|
|
</py-tutor> |
|
|
</body> |
|
|
</html> |
