什么是Tableau？
Tableau是一个可视化分析平台，改变了我们使用数据解决问题的方式--使人们和组织能够充分利用他们的数据。它是一个平台，可以将原始数据集改变或转化为容易理解的格式，而不需要任何技术技能和编码知识。
下面是一个来自tableau画廊的例子，你可以把一组原始数据转化为一个有趣的和容易理解的可视化。
public.tableau.com/en-us/galle…
为什么有人会在React应用程序中嵌入Tableau仪表板？
让我们假设你正在构建一些静态或动态的网络应用程序，以教育用户对海洋中的垃圾日益关注。所以，为了支持这个论点，你必须在涉及海洋中的垃圾分类（塑料、金属、纸、布等）上显示数据，并有一些时间线，同时允许用户与可视化进行互动。
这难道不酷吗？
下面是我创建的一个简单的React应用程序，用于嵌入一个tableau仪表盘（可在Tableau公共画廊中找到）。
在React中嵌入的步骤。
第一种方法。
所以Tableau有这个 Tableau-JavaScript Api它允许你将你的tableau仪表盘嵌入到一个react/javascript应用程序中。
为此，你需要有你的tableau仪表盘的公共网址（比如这个 http://public.tableau.com/views/RegionalSampleWorkbook/Storms).
在你的react应用程序的index.html中粘贴以下内容。
<script type=”text/javascript” src=”https://public.tableau.com/javascripts/api/tableau-2.min.js"></script>
创建一个组件来渲染仪表盘Tableau.js（你可以任意命名）。
Tableau.js
import React, { useEffect, useRef } from 'react';
const {
export const
const
const
function
newtableau.Viz(
}
return (
<div
);
}
在App.js中。
import "./App.css";
export default function
return (
<div className="App">
<h1>Tableau Dashboard in React </h1>
<Tableau/>
</div>
);
}
第二种方法
使用npm Tableau-React库。
前进和玩的代码 这里.
如果你喜欢这篇文章，请点击下面的鼓掌👏图标，并关注更多信息🎃
在React应用中嵌入Tableau仪表盘 📑最初发表于Nerd For Techon Medium，在那里人们通过强调和回应这个故事继续对话。
