Javascript Python单击事件的绘图(脱机)
是否可以将单击事件添加到绘图散点图(Python中的脱机模式) 例如,我想在单击时更改一组分散点的形状 我到目前为止所做的尝试 通过阅读网站上的其他问题(没有明确的答案),我的理解是,我可能必须生成html,然后在事后通过输入javascript代码对其进行编辑?因此,我可以编写一个javascript函数,将其保存到我的_js.js中,然后从html链接到它?根据Plotly的说法,这是不受支持的,至少截至2015年12月Javascript Python单击事件的绘图(脱机),javascript,python,plotly,scatter,Javascript,Python,Plotly,Scatter,是否可以将单击事件添加到绘图散点图(Python中的脱机模式) 例如,我想在单击时更改一组分散点的形状 我到目前为止所做的尝试 通过阅读网站上的其他问题(没有明确的答案),我的理解是,我可能必须生成html,然后在事后通过输入javascript代码对其进行编辑?因此,我可以编写一个javascript函数,将其保存到我的_js.js中,然后从html链接到它?根据Plotly的说法,这是不受支持的,至少截至2015年12月 如果你喜欢冒险,那篇文章确实包含了一些关于如何自己实现这个功能的提示。
如果你喜欢冒险,那篇文章确实包含了一些关于如何自己实现这个功能的提示。我在plotly中做了一些离线绘图的工作,遇到了同样的挑战 我想出了一个难题,证明我的想法对其他人有启发作用 一些限制:
- 假设脱机输出位于单个html文件中,用于单个绘图
- 假设您的on事件与事件处理程序的名称相同
- 需要漂亮的汤
- 假设您已经安装了lxml
- 使用Plotly 2.2.2开发
import bs4
def add_custom_plotly_events(
filename,
events = {
"plotly_click": "function plotly_click(data) { console.log(data); }",
"plotly_hover": "function plotly_hover(data) { console.log(data); }"
},
prettify_html = True
):
# what the value we're looking for the javascript
find_string = "Plotly.newPlot"
# stop if we find this value
stop_string = "then(function(myPlot)"
def locate_newplot_script_tag(soup):
scripts = soup.find_all('script')
script_tag = soup.find_all(string=re.compile(find_string))
if len(script_tag) == 0:
raise ValueError("Couldn't locate the newPlot javascript in {}".format(filename))
elif len(script_tag) > 1:
raise ValueError("Located multiple newPlot javascript in {}".format(filename))
if script_tag[0].find(stop_string) > -1:
raise ValueError("Already updated javascript, it contains:", stop_string)
return script_tag[0]
def split_javascript_lines(new_plot_script_tag):
return new_plot_script_tag.string.split(";")
def find_newplot_creation_line(javascript_lines):
for index, line in enumerate(javascript_lines):
if line.find(find_string) > -1:
return index, line
raise ValueError("Missing new plot creation in javascript, couldn't find:", find_string)
def join_javascript_lines(javascript_lines):
# join the lines with javascript line terminator ;
return ";".join(javascript_lines)
def register_on_events(events):
on_events_registration = []
for function_name in events:
on_events_registration.append("myPlot.on('{}', {})".format(
function_name, function_name
))
return on_events_registration
# load the file
with open(filename) as inf:
txt = inf.read()
soup = bs4.BeautifulSoup(txt, "lxml")
new_plot_script_tag = locate_newplot_script_tag(soup)
javascript_lines = split_javascript_lines(new_plot_script_tag)
line_index, line_text = find_newplot_creation_line(javascript_lines)
on_events_registration = register_on_events(events)
# replace whitespace characters with actual whitespace
# using + to concat the strings as {} in format
# causes fun times with {} as the brackets in js
# could possibly overcome this with in ES6 arrows and such
line_text = line_text + ".then(function(myPlot) { " + join_javascript_lines(on_events_registration) +" })".replace('\n', ' ').replace('\r', '')
# now add the function bodies we've register in the on handles
for function_name in events:
javascript_lines.append(events[function_name])
# update the specific line
javascript_lines[line_index] = line_text
# update the text of the script tag
new_plot_script_tag.string.replace_with(join_javascript_lines(javascript_lines))
# save the file again
with open(filename, "w") as outf:
# tbh the pretty out is still ugly af
if prettify_html:
for line in soup.prettify(formatter = None):
outf.write(str(line))
else:
outf.write(str(soup))
你如何使用这个功能?如果你能展示一个(基本的)例子,那就太好了!作为报告生成过程的一部分,我生成了一些绘图散点图(州的聚合和州以下区域的聚合)。由于防火墙的乐趣,我需要它们离线。我使用onclick在状态级聚合之间移动,以深入到区域级聚合。