关于#js调用py数据#的问题，如何解决？

制作数据可视化看板。想将js文件柱状图代码的y轴数据，调用为py文件中处理好的数据，

img

即将图中的 data_hegelv 调用为py文件中的数据，比如py文件中list = [1,1,1,1],想将js文件中的data_hegelv = py中的list

无法调用python里面的数据，你这个需要搭建一个简易python服务器，是web开发里面前后端分离，数据交互。

let pythonData;
// ...
function getData() {
    eel.get_data()(result => pythonData = result); // 把全局变量设置为 result
}

(function() {
    // ...
    data_hegelv = pythonData;
});

简单的python数据可视化
可以借鉴下
https://blog.csdn.net/weixin_35508482/article/details/116222123

来自NewBing和LP的编写：

想要在JavaScript中使用Python处理后的数据，可以用多种方法。以下我将提供一个例子，这个例子中，将用 Flask web 框架和 AJAX 技术来实现这一需求。

首先，你要在Python文件中创建一个Flask应用，该应用有一个路由，可以返回你想要在JavaScript中使用的数据。Python代码可能如下所示：

from flask import Flask, jsonify

app = Flask(__name__)

@app.route('/get_data')
def get_data():
    data = [1, 1, 1, 1]  # 这里填入你的数据处理逻辑
    return jsonify(data)

if __name__ == "__main__":
    app.run(debug=True)

然后，在JavaScript文件中，你可以使用AJAX向该路由发送GET请求以获取数据。你需要引入jQuery库才能使用$.get()函数。JavaScript代码可能如下所示：

$(document).ready(function() {
    $.get('http://localhost:5000/get_data', function(data) {
        let myChart = echarts.init(document.querySelector('.bar1 .chart')); 
        let dataAxis = {...}; 
        let data_jianyan = {...}; 
        let data_hege = {...}; 
        let data_buhege = {...};
        let data_hegelv = data;  // 这里使用从Python获取的数据

        // 以下填入你的 Echarts 图表设置代码
        ...
    });
});

请注意，这个示例假定你的Flask应用运行在localhost的5000端口上。如果你在其他地方运行应用，需要改变URL。

此外，此方法要你的网页支持跨源资源共享（CORS），因为你的JavaScript代码（可能在一台服务器上运行）正在尝试访问在另一台服务器上运行的Python应用。有多种方法可以处理这个问题，但最简单的一种可能是使用Flask-CORS扩展在你的Flask应用中允许跨源请求。

确保根据你的实际需求和环境修改这个示例。

基于new bing的参考：
要在JS中调用Python的数据，可以使用Node.js中的Child Process模块来实现。具体的步骤如下：

1.首先，在Node.js环境下，使用Child Process模块的exec函数执行Python脚本，并将Python数据以JSON格式输出到控制台：

const { exec } = require('child_process');

let pythonScript = 'path/to/your/python/script.py';
let command = `python ${pythonScript}`;

exec(command, (error, stdout, stderr) => {
  if (error) {
    console.error(`exec error: ${error}`);
    return;
  }
  let data = JSON.parse(stdout);
  console.log(data); // 输出Python数据
});

2.在Python脚本中，将想要传递给JS的数据转换为JSON格式，并打印到控制台：


import json

list = [1,1,1,1]
data = {"list": list}

print(json.dumps(data))

3.在JS中，通过解析控制台输出的JSON数据来获取Python数据：

let data_py = JSON.parse(stdout);
let data_hegelv = data_py.list;

这样就可以将Python中的list数据传递给JS中的data_hegelv变量了。

以下答案由GPT-3.5大模型与博主波罗歌共同编写：
要在JS中调用Python数据，可以通过使用Ajax来实现。这样就可以向服务器发送请求，返回处理好的数据。

具体步骤如下：

  1. 在Python中编写一个API，该API将处理好的数据以JSON格式返回。例如：
from flask import Flask, jsonify

app = Flask(__name__)

@app.route('/data')
def get_data():
    data = [1, 1, 1, 1] # 这里手动设置数据
    return jsonify(data)
  1. 在JS代码中使用Ajax来调用API，并将返回的数据设置为图表的数据。例如：
$.ajax({
    url: '/data',
    type: 'GET',
    success: function(response) {
        var data_hegelv = response;
        // 将 data_hegelv 设置为图表的数据
        // ...
    }
});

这里使用了jQuery库来进行Ajax请求。

以上代码仅供参考，具体实现可能会因为框架和库的不同而略有差异。
如果我的回答解决了您的问题，请采纳！

以下答案由GPT-4.5Plus大模型(语音)与博主A努力中.......共同编写：

JS调用Python接口获取数据,常见的解决方案有以下几种:

  1. Flask + CORS:
  • Flask:Python的轻量级Web框架
  • CORS:跨源资源共享(Cross-Origin Resource Sharing),允许浏览器向跨源服务器发出XMLHttpRequest请求
    在Flask服务器中设置CORS,然后JS就可以跨域访问该服务器的接口。示例代码:

Flask服务器:

python
from flask import Flask
from flask_cors import CORS

app = Flask(__name__)
CORS(app)

@app.route('/data')
def getData():
    return {'data': 'Hello World'}

JS代码:

js
fetch('http://localhost:5000/data')
  .then(res => res.json())
  .then(data => console.log(data))

  1. Django + CORS:
    与Flask类似,在Django中也可以简单配置CORS来实现跨域数据访问。

  2. Node.js中间层:
    实现一个Node.js的中间层服务器,JS请求这个中间层服务器,该服务器再请求Python接口,然后将响应返回给JS。

  3. JSONP:
    JSONP是一种跨域数据访问技术,原理是动态添加<script>标签来发起请求。示例如下:

Python服务器:

python 
@app.route('/jsonp')
def jsonp():
    callback = request.args.get('callback')
    data = {'data': 'Hello World'}
    return '{0}({1})'.format(callback, data)

JS代码:

js
<script>
function callback(data) {
  console.log(data);
}
</script>
<script src="http://localhost:5000/jsonp?callback=callback"></script>

以上就是几种常见的JS调用Python获取数据的跨域方案,希望对你有所帮助。如果你有任何其他问题,也欢迎在CSDN提出,我很乐意解答和讨论。