-
Notifications
You must be signed in to change notification settings - Fork 7
/
dashboard.html
75 lines (74 loc) · 4.54 KB
/
dashboard.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="bootstrap/css/tutorialstyle.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link href="https://fonts.googleapis.com/css?family=Rubik+Mono+One" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet">
<title>Tableau Dashboard</title>
</head>
<body>
<div class = 'col-md-2'>
<h3><a href='index.html' class='class1'>Home</a></h3>
<h3><a href='projects.html' class='class1'>Projects</a></h3>
<h3><a href='tutorials.html' class='class1'>Tutorials</a></h3>
<h3><a href='analysis.html' class='class1'>Analysis</a></h3>
</div>
<div class = 'col-md-6'>
<h2>Creating a Tableau Dashboard</h2>
<h2> by Matthew Barlowe</h2>
<br />
<p>If you read my last tutorial on <a href='pivot.html'>Pivot Tables</a> and followed along
you would have created a graph where you could select a player from the drop down menu
and the visual would show you that player's values for each stat. But what if you wanted to compare
two different players at one time? Well that's where Tableau's dashboard comes in handy,
and with a couple clicks you'll have a nice comparison feature up and running.
<p>So once you have the intial graph created from the Pivot Table tutorial created, the next step in
creating your comparison dashboard is to right click on the Sheet 1 tab (or whatever
you have renamed it to) and select Duplicate. As you would expect from the name
this will create an exact replica of your first graph. Now you have two graphs that
do the exact same thing it's time to move on and create the comparison dashboard.
<h2><b>Creating the Dashboard</b></h2>
<p>Now that you have the two graphs created its time to create a new dashboard in Tableau.
This is done by click on the icon next to the worksheet tabs that looks like four squares
with a plus on it. This will change the screen to the dashboard work space that looks like
this:
<div class='fitimage'>
<img src='img/dashboard.png' alt='A blank dashboard'>
</div>
<br />
<p>The first step I do when create a dashboard is to change the size of the dashboard
to fit what my needs are. You can see the size dropdown menu on the left of the screen.
It is preset to a Range of values which adjust depending on the screen of the viewer. For
this dashboard I'm just going to set a fixed size. So I click on the size and then next I
click on Range and select Fixed instead. Next I click on the size underneath fixed and
select Laptop Browser which will then increase the size of the white space.
<p>So next all you have to do is drag the two sheets from the left hand menu onto the
dashboard space. Once you do that you will have something like this:
<div class='fitimage'>
<img src='img/firstdashboard.png' alt='A blank dashboard'>
</div>
<br />
The only other move I would do is drag the drop boxes to the top of the dashboard so they
are over the top of their respective graphs and that's it. You've now created your first
true dashboard and it's that simple. As you can see most of the work is done in the worksheets
themselves before you start creating the dashboard itself. Now this isn't everything
you can do in a Dashboard, but to get a simple, yet powerful and informative,
up and running only takes a couple of steps once you have the original graphs created.
Here is what your final product should look like:
<div class='fitimage'>
<img src='img/finisheddashboard.png' alt='A blank dashboard'>
</div>
<br />
<p>The finished dashboard can be found <a href='https://public.tableau.com/profile/matthew.barlowe#!/vizhome/testing_144/Dashboard1'>
here</a> if you want to download the workbook and play around with the dashboard. This
is just the beginning of what one can do with dashboard as there are many aesthetic
options one can tweek to change the finished appearance of the dashboard itself. I'll get
into all the options in a later tutorial one can do to customize their dashboard, but to get
you started on sharing your data with the world this is a good first step.
</div>
<div class = 'col-md-4'>
</div>