blocks|key|2570078|text|plotly.js是一个很棒的JS库，它可以让你轻松地可视化web上的任何数据。你可以查看链接并在互联网上搜索一些教程，比如这个，但我不认为这是问题所在。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|2570079|问题出在从文件中获取数据。|style|BOLD|2570080|当涉及到web时，您将需要某种类型的web服务器来提供和接收文件。|2570081|web浏览器允许用户输入文件(这可以通过html标签input来完成)，然后它将一个包含文件数据的请求发送到您的web服务器(这是您的JS代码所在的位置)，然后您可以在那里对数据做任何您想做的事情，并发送一个响应以供浏览器显示。|CODE|2570082|虽然web服务器可能很容易入门，但您可以使用许多不同的语言(包括JavaScript)来实现，但我认为到目前为止，构建web服务器并不符合您的兴趣。|2570083|如果您坚持使用JavaScript进行构建，则必须找到另一种方法来获取要绘制的数据，或者实际构建某种类型的服务器来处理您希望用户输入的文件。如果这真的适合你，这里有一个用Node.js+(JavaScript)构建web服务器的starting+tutorial，这是一个用django+(Python)构建web服务器的another+one。|2570084|但是如果你不喜欢这个想法并且不介意回到，你可以使用matplotlib.|2570085|Python有一个名为matplotlib的第三方模块，它允许您非常容易地绘制点，并使用许多不同的定制绘制它们。|2570086|所以，在你从你的文件中提取你的点之后，你可以删除你正在使用的任何Pygame代码，而不是非常简单地这样做：|2570087|import+matplotlib.pyplot+as+plt

...++#+extracting+your+points+from+the+files

plt.plot(xpoints,+ypoints)
plt.show()|code-block|syntax|javascript|2570088|，其中+ypoints+和是文件中的点|2570089|这将创建一个折线图。您可以通过向plot函数传递一个可选的第三个参数来自定义此图形，例如：|2570090|plt.plot(xpoints,+ypoints,+"x")|2570091|这将只绘制点，而不是绘制直线。您还可以将"x“更改为"ro”、"bo“、"r%2B”等等。|2570092|您可以参考上面的链接来查看matplotlib文档，并选择是想要尝试它，还是仍然坚持使用JS。然而，我认为，在这种情况下，您必须找到另一种方法来获取数据，因为构建web服务器需要时间和理解，而且一开始可能会非常混乱:)|2570093|entityMap|0|LINK|mutability|MUTABLE|url|https://plot.ly/javascript/getting-started/|1|https://www.nodebeginner.org/|2|https://developer.mozilla.org/en-US/docs/Learn/Server-side/Django/Introduction|3|https://matplotlib.org/tutorials/introductory/pyplot.html#sphx-glr-tutorials-introductory-pyplot-py^0|0|9|0|0|0|D|0|0|Q|5|0|0|36|H|1|4H|B|2|0|J|H|0|B|A|3|0|0|0|0|3|4|7|C|4|4|7|0|G|4|0|0|0|0^^$0|@$1|2|3|4|5|6|7|1P|8|@]|9|@$A|1Q|B|1R|1|1S]]|C|$]]|$1|D|3|E|5|6|7|1T|8|@$A|1U|B|1V|F|G]]|9|@]|C|$]]|$1|H|3|I|5|6|7|1W|8|@]|9|@]|C|$]]|$1|J|3|K|5|6|7|1X|8|@$A|1Y|B|1Z|F|L]]|9|@]|C|$]]|$1|M|3|N|5|6|7|20|8|@]|9|@]|C|$]]|$1|O|3|P|5|6|7|21|8|@]|9|@$A|22|B|23|1|24]|$A|25|B|26|1|27]]|C|$]]|$1|Q|3|R|5|6|7|28|8|@$A|29|B|2A|F|G]]|9|@]|C|$]]|$1|S|3|T|5|6|7|2B|8|@]|9|@$A|2C|B|2D|1|2E]]|C|$]]|$1|U|3|V|5|6|7|2F|8|@]|9|@]|C|$]]|$1|W|3|X|5|Y|7|2G|8|@]|9|@]|C|$Z|10]]|$1|11|3|12|5|6|7|2H|8|@$A|2I|B|2J|F|G]|$A|2K|B|2L|F|G]|$A|2M|B|2N|F|G]|$A|2O|B|2P|F|L]]|9|@]|C|$]]|$1|13|3|14|5|6|7|2Q|8|@$A|2R|B|2S|F|L]]|9|@]|C|$]]|$1|15|3|16|5|Y|7|2T|8|@]|9|@]|C|$Z|10]]|$1|17|3|18|5|6|7|2U|8|@]|9|@]|C|$]]|$1|19|3|1A|5|6|7|2V|8|@]|9|@]|C|$]]|$1|1B|3|-4|5|6|7|2W|8|@]|9|@]|C|$]]]|1C|$1D|$5|1E|1F|1G|C|$1H|1I]]|1J|$5|1E|1F|1G|C|$1H|1K]]|1L|$5|1E|1F|1G|C|$1H|1M]]|1N|$5|1E|1F|1G|C|$1H|1O]]]]

<a href="https://plot.ly/javascript/getting-started/" rel="nofollow noreferrer">plotly.js</a> is a great JS library that will allow you to visualize any data on the web with ease. You can check out the link and search for some tutorials on the internet, such as this one, but I don't think that is the problem.

The issue is with getting the data from a file.

When it comes to the web, you will need some sort of web server that can serve and receive files. 

The web browser allows the user to input the file (this can be done with html tag <code>input</code>), then it sends a request containing the file data to your web server (this is where your JS code is), where you can then do whatever you like with the data and send a response back to be shown by the browser.

Although web server might be easy to get started in, with many different languages you can do it in (including JavaScript), I'm assuming it is not in your interest to build web servers as of yet.

If you insist on building this with JavaScript, you will have to find another method to get the data you want to plot, or actually build some kind of server that can handle these files you want the user to input. If this is really for you, here is a <a href="https://www.nodebeginner.org/" rel="nofollow noreferrer">starting tutorial</a> for building web server with Node.js (JavaScript), and here is <a href="https://developer.mozilla.org/en-US/docs/Learn/Server-side/Django/Introduction" rel="nofollow noreferrer">another one</a> for building web server with django (Python)

But if you don't like this idea and don't mind going back to Python, you can use matplotlib.

Python has a 3rd party module called <a href="https://matplotlib.org/tutorials/introductory/pyplot.html#sphx-glr-tutorials-introductory-pyplot-py" rel="nofollow noreferrer">matplotlib</a>, which allows you to very easily plot points and graph them with many different customizations.

So, after you extract your points from your files, you can then remove whatever Pygame code you were using and instead very simply do:

<pre><code>import matplotlib.pyplot as plt

... # extracting your points from the files

plt.plot(xpoints, ypoints)
plt.show()
</code></pre>

Where <code>xpoints</code> and <code>ypoints</code> are the points from the files

This will create a line graph. You can customize this graph by passing in an optional third argument to the <code>plot</code> function, for e.g:

<pre><code>plt.plot(xpoints, ypoints, "x")
</code></pre>

This will only plot the points instead of drawing a line. You can also change "x" to "ro", "bo", "r+" and so many more.

You can refer to the link above to take a look at the matplotlib documentation and choose whether you would like to try it out or really still stick to JS. However IMO I think you will have to find another way to get your data in that case as building web servers takes time and understanding, and may be very confusing at first :)

I have been using Tkinter and Pygame for a GUI to visualize data points.
With Tkinter, files are chosen from a list, and then a Pygame window is open where the data points are graphed.
Pygame is not meant for data visualization, and I would like to use an alternative.

I want to use JavaScript to visualize the data, but I don't know how I would bring the large amounts of point data from my files into a browser window, and then have the user be able to manipulate the data (moving, adding, or deleting points), and then saving that data back out.

What tools do I need to bring the data into JavaScript, generate graphics for graphing and some other basic shapes (text, lines, dots), and then export the data out?

JavaScript for visualizing, manipulating, and exporting data points?

数据可视化

服务器

Python

我一直在使用Tkinter和Pygame作为GUI来可视化数据点。使用Tkinter，从列表中选择文件，然后打开Pygame窗口，在其中绘制数据点。Pygame不是用于数据可视化的，我想使用另一种方法。我想使用JavaScript来可视化数据，但是我不知道如何将大量的点数据从我的文件带到浏览器窗口中，然后让用户能够操作...

问用于可视化、操作和导出数据点的JavaScript？
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问用于可视化、操作和导出数据点的JavaScript？EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问用于可视化、操作和导出数据点的JavaScript？
EN