PlotSet LogoPlotSet

PlotSet Chrome Extension

Chart the data you find while you are browsing. The PlotSet extension takes numbers from a web page into the chart editor, and what comes out the other end is an ordinary PlotSet chart with a public URL and a one-line embed snippet.

用 Chrome Extension 数据做出的图表

这不是截图,而是一张真实的交互式图表,嵌入方式和你自己的完全一样。

示例:Tallest buildings in the world

嵌入代码

一行 HTML。这就是上面那张图表的真实代码——粘贴到任何支持 HTML 的页面即可。

<iframe width="100%" height="100%" src="https://plotset.com/api/embed/d944060a-a570-41f3-b3db-64f466b95f88" />

尺寸由你决定:直接在 iframe 上设置宽高,或把它放进一个按你自己比例设定的容器里。

PlotSet 与 Chrome Extension:实话实说

Most charts start with a copy and paste. You find a table on a page — a league table, a price list, a set of results — and you spend ten minutes moving it into a spreadsheet before you can do anything with it. The PlotSet extension exists to remove that step: it lives in the Chrome toolbar, it hands the data on the page to the PlotSet editor, and from that point you are in the normal chart-building flow with the full template library available. Nothing about the chart itself is special. It is a project in your account like any other, it can be re-bound, re-themed and re-published, and when you are happy with it you get a URL and an iframe snippet that will drop into a post, a wiki, a report or a dashboard. That last part is what this page is really about, because a chart nobody can embed is a screenshot with extra steps.

如何用 Chrome Extension 数据做图表

从表格到发布嵌入,一步一步来。

01

Install the extension from the Chrome Web Store

Search for PlotSet in the Chrome Web Store and add it to Chrome. It works in any Chromium browser — Chrome, Edge, Brave, Arc — and pinning it to the toolbar saves you a click every time.

02

Open the page with the data on it

Any page whose numbers you can read in the browser: a statistics table, a results page, a documentation page with a comparison grid. Then click the PlotSet icon.

03

Check the columns before you chart anything

Captured tables arrive with the page's own formatting — thousands separators, currency symbols, footnote markers stuck to values. Clean those in the editor first, because a number stored as text will not plot.

04

Pick a template and bind the columns

Choose the chart type, then tell it which column is the label and which is the value. Around 300 templates are available, from ordinary bar and line charts to choropleth maps, sankey diagrams and animated bar chart races.

05

Publish the chart

Publishing gives the chart a public URL and the one-line iframe snippet shown above. Copy it — that is everything any site needs.

06

Paste the snippet where the chart belongs

A Custom HTML block in WordPress, an embed block in Notion, a code block in Ghost or Webflow, a plain HTML page. Give it a height as well as a width — around 450px suits most charts.

相比 Chrome Extension 自带图表,你多得到什么

  • The data does not go through a spreadsheet first

    Fewer hands on the numbers means fewer transcription errors, and the whole loop from finding a table to publishing a chart takes a couple of minutes rather than an afternoon.

  • You keep the source next to the chart

    You are on the page the data came from when you build the chart, which is the right moment to write the source line into the footer. Charts published without a source are the ones that get questioned later.

  • Chart types a screenshot cannot give you

    The extension is a way into the same library the editor uses: maps, treemaps, sankeys, bump charts, population pyramids, races. Recreating any of those by hand from a web table is an afternoon's work.

  • Every chart is embeddable and exportable

    One URL, one iframe snippet, plus PNG, SVG and PDF export. The same chart can go into a blog post, a slide and a PDF report without being rebuilt for each.

  • Update the chart, not every copy of it

    Because the page holds a URL rather than an image, re-uploading the data updates the chart everywhere it has been embedded.

它做不到什么

  • It needs real text on the page

    Numbers that only exist inside a picture, a canvas element or a PDF viewer are not text to a browser. If you cannot select the value with your cursor, expect to type it in yourself.

  • Web tables are rarely tidy

    Merged headers, footnote markers, ranking columns and units stuck to values are normal on the web and awkward in a chart. Budget a minute for cleaning up whatever comes across.

  • Check the licence before you republish

    The extension makes it easy to chart someone else's table; it does not make it yours. Cite the source, and check the terms if the data came from a commercial site.

  • The embed is an iframe, so it is not indexed as page text

    Search engines read your page, not the chart inside it. Any number you want found should also appear in the surrounding copy — which is better writing anyway.

  • There is no live sync from the source page

    The chart holds its own copy of the data. When the page updates, the chart does not; re-capture or re-upload, and every embed then updates at once.

Chrome Extension 图表常见问题

It takes data you have found on a web page into the PlotSet chart editor, so you can build an interactive chart from it without moving the numbers through a spreadsheet by hand.

把你的 Chrome Extension 数据发布成交互式图表

导入数据,几分钟内得到一张可嵌入的交互式图表——免费,无需信用卡。