zhangyuqing
/
pythonbook
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

shao

This commit is contained in:
aiolishi 2024-03-13 09:13:30 +08:00
parent 115c18cd20
commit 486abc09c9
2 changed files with 72 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

61
fastapi_plotly/index2.html Normal file
View File

@ -0,0 +1,61 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>3D Scatter Plot with Input</title>
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<style>
html, body {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
}
#plot {
height: 80vh;
width: 100vw;
}
#inputForm {
padding: 20px;
}
</style>
</head>
<body>
<div id="inputForm">
<input type="number" id="xInput" placeholder="X value">
<input type="number" id="yInput" placeholder="Y value">
<input type="number" id="zInput" placeholder="Z value">
<button onclick="submitData()">Submit</button>
</div>
<div id="plot"></div>
<script>
var trace = {
x: [], y: [], z: [],
mode: 'markers',
type: 'scatter3d'
};
var layout = {
title: '3D Scatter Plot'
};
Plotly.newPlot('plot', [trace], layout);
function submitData() {
var xValue = document.getElementById('xInput').value;
var yValue = document.getElementById('yInput').value;
var zValue = document.getElementById('zInput').value;
fetch('http://localhost:8000/data', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({x: xValue, y: yValue, z: zValue}),
})
.then(response => response.json())
.then(data => {
Plotly.extendTraces('plot', { x: [[data.x]], y: [[data.y]], z: [[data.z]] }, [0]);
});
}
</script>
</body>
</html>

19
fastapi_plotly/main.py
View File

@ -10,13 +10,12 @@ import uvicorn
app = FastAPI()
# CORS中间件的设置
app.add_middleware(
CORSMiddleware,
allow_origins=["*"], # 允许所有源
allow_origins=["*"],
allow_credentials=True,
allow_methods=["*"], # 允许所有方法
allow_headers=["*"], # 允许所有头部
allow_methods=["*"],
allow_headers=["*"],
)
class Item(BaseModel):
@ -24,17 +23,21 @@ class Item(BaseModel):
y: float
z: float
@app.get("/data")
async def get_data():
return JSONResponse(content={"x": random.random(), "y": random.random(), "z": random.random()})
@app.post("/data")
async def post_data(item: Item):
# 这里可以对item进行任何需要的处理
return item
@app.get("/")
async def get_index():
# 直接返回同目录下的index.html文件
return FileResponse('index.html')
@app.get("/2")
async def get_index():
# 直接返回同目录下的index.html文件
return FileResponse('index2.html')
def main():
# 使用uvicorn运行FastAPI应用，指定主机地址和端口
uvicorn.run(app, host="127.0.0.1", port=8000, log_level="info")
if __name__ == "__main__":