Show Sidebar Hide Sidebar

3D Surface Plots in Chart Studio

Create a three-dimensional surface plot that connects a set of data points.

Step 1

Try an Example

We love interactive graphs at Chart Studio. This 3D surface chart can be rotated in place by dragging the mouse inside the plot. It's also a cool way to show relationships between large amounts of data that may be difficult to see in a 2D plot.

After selecting '3D Surface' under 'Chart Type', you can check out an example before adding your own data. Clicking the 'try an example' button will show what a sample chart looks like after adding data and playing with the style. You'll also see what values and style attributes were selected for this specific plot, as well as the end result.

Example Surface

You can also use the data featured in this tutorial by clicking on 'Open This Data in Chart Studio' on the left-hand side. It'll open in your workspace.

Open data

Step 2

Add Your Data to Chart Studio

Head to Chart Studio’s new online workspace and add your data. You have the option of typing directly in the grid, uploading your file, or entering a URL of an online dataset. Chart Studio accepts .xls, .xlsx, or .csv files. For more information on how to enter your data, see this tutorial.

Import data main

Step 3

Create a Chart

After adding your own data, go to GRAPH on the left-hand side, then 'Create'. Choose '3D Surface' under 'Chart type'.

Choose chart main

After selecting ‘3D Surface', you should then fill out the Z, X, and Y dropdowns to create the plot.

Values dropdown

This will create a raw 3D surface plot as seen below.

Raw plot

Step 4

Style a Chart

You can choose your colorscale, text position, or typeface. Click on STYLE on the left-hand side to play around with the style of your plot. Note that certain colors and typeface are only available with a PRO subscription. Click here to upgrade!

Colour main

To add a title to your graph, you can type it directly on the title by double-clicking it. The same can be done for the colorbar.

Type directly title

Another option is to visit the 'Layout' section under STYLE, click on 'Text' and enter your title in the box, as shown below.

Type in layout panel

For adding axes labels, the 'Text' box is found in the 'Axes' section under STYLE. Note that you have to click on each X, Y, and Z text box to add its own label. We'll leave the labels as default on our plot.

Type directly axis

Our plot is now done! We've styled it a bit, and to learn how to make your plots extra fancy, check out this styling tutorial.

Type directly axis

Step 5

Save and Share

It's time to show off your plot! Click SAVE on the left-hand side.

Save main

Give your file a name, then select your PLOT and DATA as 'Public' or 'Private'. For more information on how sharing works, including the difference between private, public and secret sharing, visit this page.

Save pop-up

Still need help?
Contact Us

For guaranteed 24 hour response turnarounds, upgrade to our Premium or Enterprise plans.