Getting started with plotly in R

<!DOCTYPE html> <html> <head>  <meta charset="utf-8" /> <link rel="canonical" href="https://plotly.com/r/getting-started/" /> <link rel="preconnect" href="https://fonts.googleapis.com" /> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin /> <link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@1,500&display=swap" rel="stylesheet" />  <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <script src="/all_static/javascripts/algolia/instantsearch.js"></script> <script src="/all_static/javascripts/algolia/polyfill.min.js"></script> <script src="//ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script> <script> const theme = localStorage.getItem('theme'); if (theme === "dark-mode") { var root = document.getElementsByTagName('html')[0]; // '0' to assign the first (and only `HTML` tag) root.setAttribute('class', 'dark-mode'); } </script> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" crossorigin="anonymous"> <script src="https://stackpath.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" crossorigin="anonymous"></script> <link href="https://esm.sh/@markprompt/css@0.18.0?css" rel="stylesheet" /> <link href="/all_static/css/markprompt.css" rel="stylesheet" />    <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js?config=TeX-MML-AM_CHTML"></script>  <script src="https://cdn.plot.ly/plotly-1.58.4.min.js"></script> <script src="/all_static/r_files/r_dependencies.js"></script>   <link href="//fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600,600italic,700,700italic,800,800italic|Ubuntu+Mono:400,700|Asap" rel="stylesheet" type="text/css" /> <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" />  <link rel="stylesheet" type="text/css" href="/all_static/css/main.css?version=false" /> <link rel="stylesheet" type="text/css" href="/all_static/css/improve.css?version=2024-11-28-17-16">    <link rel="shortcut icon" href="https://dash.plotly.com/assets/favicon.ico" />   <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-N6T2RXG');</script>      <title> Getting started with plotly in R </title> <meta name="description" content="Detailed examples of Getting Started with Plotly including changing color, size, log axes, and more in R.">  <meta name="msvalidate.01" content="D319859A832F9F1D15A7646E2A42150A" />  <meta property="og:title" content= Getting started with plotly in R /> <meta property="og:type" content="website"/> <meta property="og:image" content="https://help.plot.ly/images/twitter-default.png"> <meta property="og:description" content="Detailed examples of Getting Started with Plotly including changing color, size, log axes, and more in R."/> <meta property="og:url" /> <meta property="fb:admins" content="1123751525"/> <meta property="fb:admins" content="22418"/>  <meta name="twitter:card" content="photo" /> <meta name="twitter:title" content= Getting started with plotly in R /> <meta name="twitter:url" content="https://plotly.com/r/getting-started/"/> <meta name="twitter:description" content="Detailed examples of Getting Started with Plotly including changing color, size, log axes, and more in R."/> <meta name="twitter:image" content="https://help.plot.ly/images/twitter-default.png"> <meta name="twitter:site" content="@plotlygraphs"/> </head> <body data-spy="scroll" data-target=".watch" style="position:relative;" class="darkmode">  <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-N6T2RXG" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>   <div class="menu-mobile"> <div class="switch-mode"> <div class="icon-dark"></div> <div class="switch"></div> <div class="icon-light"></div> </div> <div class="close-menu"></div> <ul> <li><a style="font-weight: bold;" href="https://community.plotly.com/c/plotly-r-matlab-julia-net/29">Forum</a> </li> <li><a style="font-weight: bold;" href="https://plotly.com/get-pricing/">Pricing</a></li> <li><a style="font-weight: bold;" href="https://dash.plotly.com">Dash</a></li>  </ul> </div> <div class="header-container"> <header class="header-main --default"> <div class="--wrap"> <div class="--wrap-left"> <div class="-identity"> <a href="https://plotly.com/"><img src="/all_static/images/graphing_library_dark.svg" style="height: 30px;" class="logo-dark"></a> <a href="/graphing-libraries/"><img src="/all_static/images/graphing_library.svg" style="height: 30px;" class="logo-white"></a> </div> </div> <div class="--wrap-right"> <nav class="--nav-meta" role="navigation"> <ul> <li class="languages"> <a class="r"> <div class="icon"></div> R </a> <ul> <li> <a href="https://plotly.com/python/" class="python"> <div class="icon"></div>Python (v5.24.1) </a> </li> <li> <a href="https://plotly.com/r/" class="r"> <div class="icon"></div>R </a> </li> <li> <a href="https://plotly.com/julia/" class="julia"> <div class="icon"></div>Julia </a> </li> <li> <a href="https://plotly.com/javascript/" class="plotly_js"> <div class="icon"></div>Javascript (v2.35.2) </a> </li> <li> <a href="https://plotly.com/ggplot2/" class="ggplot2"> <div class="icon"></div>ggplot2 </a> </li> <li> <a href="https://plotly.com/matlab/" class="matlab"> <div class="icon"></div>MATLAB </a> </li> <li> <a href="https://plotly.com/fsharp/" class="fsharp"> <div class="icon"></div>F# </a> </li> <li> <a href="https://dash.plotly.com/" class="dash"> <div class="icon"></div>Dash </a> </li> </ul> </li> <li><a style="font-weight: bold;" href="https://community.plotly.com/c/plotly-r-matlab-julia-net/29">Forum</a> </li> <li><a style="font-weight: bold;" href="https://plotly.com/get-pricing/">Pricing</a></li> <li><a style="font-weight: bold;" href="https://dash.plotly.com">Dash</a></li>  <iframe src="https://ghbtns.com/github-btn.html?user=plotly&repo=plotly.R&type=star&count=true&size=large" style="padding-top: 5px;" frameborder="0" scrolling="0" width="160px" height="40px"></iframe> </ul> <div class="switch-mode"> <div class="icon-dark"></div> <div class="switch"></div> <div class="icon-light"></div> </div> </nav> </div> <div class="menu-icon"> <span></span><span></span><span></span> </div> </div> </header> </div> <main class="--page page--single --index"> <div class="--wrap">   <aside class="--sidebar-container"> <div class="--sidebar-fixed reference" data-spy="affix" id="where"> <div class="brand"> <a href="/graphing-libraries/"><img src="/all_static/images/graphing_library.svg" style="height: 30px;"></a> </div> <button id="modal-button" type="button" data-toggle="modal" data-target="#myModal"> <input id="modal-input" style="border-radius: 5px; width: 100%;" type="text" placeholder=" Search..." readonly /> </button> <details style="color: white;margin-top: 20px;" > <summary>Quick Reference</summary> <nav class="--sidebar-body watch" id="where"> <ul class="--sidebar-list" style="margin-left: 15px;">  <li class="--sidebar-item"> <a href="/r/getting-started" class="js-splash--navigation-item">Getting Started</a> </li> <li class="--sidebar-item"> <a href="/r/is-plotly-free" class="js-splash--navigation-item">Is Plotly Free?</a> </li>  <li class="--sidebar-item"> <a href="/r/reference/index/" class="js-splash--navigation-item">Figure Reference</a> </li>    <li class="--sidebar-item"> <a href="/ggplot2/" class="js-splash--navigation-item">ggplot2 integration</a> </li> <li class="--sidebar-item"> <a href="https://plotly.com/dash" class="js-splash--navigation-item">Dash for R</a> </li>    <li class="--sidebar-item"> <a target="_blank" href="https://github.com/plotly/plotly.R" class="js-splash--navigation-item">GitHub</a> </li> <li class="--sidebar-item"> <a target="_blank" href="http://community.plotly.com/" class="js-splash--navigation-item">community.plotly.com</a> </li> </ul> </nav> </details> <details style="color: white;margin-top: 20px;" open> <summary>On This Page</summary> <nav class="--sidebar-body watch" id="where"> <ul class="--sidebar-list" id="nav_header_insertion_list"></ul> </nav> </details> </div> <a href="https://go.plotly.com/michelin-ai-apps?utm_source=Webinar:%20Michelin%20App%20Challenge%2012/11/24&utm_medium=graphing_libraries&utm_content=sidebar" target="_blank"> <img src="https://images.prismic.io/plotly-marketing-website-2/Z0X7X5bqstJ97ydW_MichelinApp_square_ads.jpg?auto=format,compress" style="width: 200px; height: 200px; position: fixed; bottom: 10px; left: 50px" alt="Explore the Michelin Guide with AI Visualization and Insight"> </a> </aside>  <section class="--page-body --tutorial-index --base"> <header class="--welcome"> <div class="--welcome-body">  <div class="--title"> <div class="--body"> <div class="nav-breadcrumb-container"> <div> <div class="breadcrumb-nav"> <a href="/r"> R </a> > <span>Getting Started with Plotly</span> </div> </div> <div class="nav-breadcrumb-right"> <div class="--fork"> <a id="forklink" href= "https://github.com/plotly/plotly.r-docs/edit/master/r/2015-07-30-getting-started.Rmd" > <div class="icon"> <svg style="width:20px;height:20px" viewbox="0 0 24 24"> <path fill="#000000" d="M2.6,10.59L8.38,4.8L10.07,6.5C9.83,7.35 10.22,8.28 11,8.73V14.27C10.4,14.61 10,15.26 10,16A2,2 0 0,0 12,18A2,2 0 0,0 14,16C14,15.26 13.6,14.61 13,14.27V9.41L15.07,11.5C15,11.65 15,11.82 15,12A2,2 0 0,0 17,14A2,2 0 0,0 19,12A2,2 0 0,0 17,10C16.82,10 16.65,10 16.5,10.07L13.93,7.5C14.19,6.57 13.71,5.55 12.78,5.16C12.35,5 11.9,4.96 11.5,5.07L9.8,3.38L10.59,2.6C11.37,1.81 12.63,1.81 13.41,2.6L21.4,10.59C22.19,11.37 22.19,12.63 21.4,13.41L13.41,21.4C12.63,22.19 11.37,22.19 10.59,21.4L2.6,13.41C1.81,12.63 1.81,11.37 2.6,10.59Z"> </path> </svg> </div> <span>Suggest an edit to this page</span> </a> </div> </div> </div> <h1> Getting Started with Plotly in R </h1> <p>How to get started making charts with Plotly's R graphing library. </p> <br>  <details> <summary><span style="cursor: pointer; color: #506784 !important">New to Plotly?</span></summary> <p>Plotly is a <a href="/r/is-plotly-free/">free and open-source</a> graphing library for R. We recommend you read our <a href="/r/getting-started/">Getting Started guide</a> for the latest installation or upgrade instructions, then move on to our <a href="/r/plotly-fundamentals/">Plotly Fundamentals tutorials</a> or dive straight in to some <a href="/r/basic-charts/">Basic Charts tutorials</a>.</p> </details> </div> </div> </div> </header>  <section class="tutorial-content"> <h1>Getting Started with Plotly for R</h1> <p><a href="https://github.com/ropensci/plotly"><code>plotly</code></a> is an R package for creating interactive web-based graphs via the open source JavaScript graphing library <a href="http://plot.ly/javascript"><code>plotly.js</code></a>.</p> <p>As of version 2.0 (November 17, 2015), graphs created with the <code>plotly</code> R package are rendered <em>locally</em> through the <a href="http://www.htmlwidgets.org/"><code>htmlwidgets</code></a> framework.</p> <h2>Installation</h2> <h3>Download from CRAN</h3> <p>Use the <code>install.package()</code> function to install the <a href="https://cran.r-project.org/web/packages/plotly/index.html"><code>plotly R package</code></a> from <a href="https://cran.r-project.org/">CRAN</a>. This version may not be the absolute latest version, so we recommend downloading from Github using the instructions below if you can.</p> <div class="highlight"><pre><code class="language-r" data-lang="r"><span class="n">install.packages</span><span class="p">(</span><span class="s2">"plotly"</span><span class="p">)</span><span class="w"> </span></code></pre></div> <h3>Download from GitHub</h3> <p>Alternatively, you can install the latest development version of <code>plotly</code> from GitHub via the <a href="https://cran.r-project.org/web/packages/devtools/index.html"><code>devtools</code></a> R package:</p> <div class="highlight"><pre><code class="language-r" data-lang="r"><span class="n">devtools</span><span class="o">::</span><span class="n">install_github</span><span class="p">(</span><span class="s2">"ropensci/plotly"</span><span class="p">)</span><span class="w"> </span></code></pre></div> <h3>Note For <code>RStudio</code> Users</h3> <p><code>RStudio</code> users should ensure that they are using the latest <a href="https://www.rstudio.com/products/rstudio/download/">RStudio release</a> in order to ensure compatibility with the <code>htmlwidgets</code> R package.</p> <h2>Rendering Charts</h2> <p>By default, the <code>plotly</code> R package runs locally in your web browser or in the <code>RStudio</code> viewer.</p> <div class="highlight"><pre><code class="language-r" data-lang="r"><span class="n">library</span><span class="p">(</span><span class="n">plotly</span><span class="p">)</span><span class="w"> </span><span class="n">fig</span><span class="w"> </span><span class="o"><-</span><span class="w"> </span><span class="n">plot_ly</span><span class="p">(</span><span class="n">midwest</span><span class="p">,</span><span class="w"> </span><span class="n">x</span><span class="w"> </span><span class="o">=</span><span class="w"> </span><span class="o">~</span><span class="n">percollege</span><span class="p">,</span><span class="w"> </span><span class="n">color</span><span class="w"> </span><span class="o">=</span><span class="w"> </span><span class="o">~</span><span class="n">state</span><span class="p">,</span><span class="w"> </span><span class="n">type</span><span class="w"> </span><span class="o">=</span><span class="w"> </span><span class="s2">"box"</span><span class="p">)</span><span class="w"> </span><span class="n">fig</span><span class="w"> </span></code></pre></div> <div class="plotly html-widget html-fill-item" id="htmlwidget-820947d352cb73517669" style="width:672px;height:480px;"></div> <script type="application/json" data-for="htmlwidget-820947d352cb73517669">{"x":{"visdat":{"172f56c42765":["function () ","plotlyVisDat"]},"cur_data":"172f56c42765","attrs":{"172f56c42765":{"x":{},"color":{},"alpha_stroke":1,"sizes":[10,100],"spans":[1,20],"type":"box"}},"layout":{"margin":{"b":40,"l":60,"t":25,"r":10},"xaxis":{"domain":[0,1],"automargin":true,"title":"percollege"},"yaxis":{"domain":[0,1],"automargin":true},"hovermode":"closest","showlegend":true},"source":"A","config":{"modeBarButtonsToAdd":["hoverclosest","hovercompare"],"showSendToCloud":false},"data":[{"fillcolor":"rgba(102,194,165,0.5)","x":[19.631391799999999,11.2433076,17.033819399999999,17.278953900000001,14.475999,18.9046238,11.917387700000001,16.197120900000002,14.1076487,41.295808100000002,13.567226,15.1108627,13.683010299999999,15.387469299999999,25.175041199999999,28.0181167,16.985807600000001,14.5978891,32.835928000000003,16.195960100000001,16.868525900000002,42.768866899999999,16.839932699999999,16.9356446,20.275196399999999,13.6029941,17.827356099999999,14.7056662,15.5321976,11.367521399999999,13.049546400000001,18.3778784,14.0467657,20.6605223,14.3184422,13.7735504,18.723633400000001,15.1666829,36.643665300000002,15.025603500000001,18.369895499999998,14.758309300000001,16.413352799999998,14.352436300000001,27.593883399999999,17.640962200000001,24.889348500000001,19.343636499999999,37.834052900000003,16.899526699999999,14.538812800000001,18.476678,14.503143700000001,17.949222599999999,27.928023899999999,28.0541488,33.818550700000003,19.861855599999998,14.0083929,19.6994744,16.449385100000001,17.534883700000002,13.505452500000001,14.034565000000001,18.511502,16.474421100000001,19.920618600000001,11.723732,20.724422799999999,15.7185951,18.779374499999999,25.838414,13.562244099999999,22.011856999999999,12.174280899999999,14.2502659,14.3687708,16.521279400000001,12.741278899999999,21.507740200000001,21.300728899999999,21.184251,15.4883463,28.988154900000001,14.636542199999999,13.0760986,15.9511699,16.878980899999998,19.879575299999999,20.0448263,17.879589800000002,17.057172900000001,24.730046900000001,20.458265099999998,15.960024199999999,15.680702699999999,15.928739800000001,16.553049699999999,24.7568609,21.059561599999999,22.652363999999999,22.805217599999999],"type":"box","orientation":"h","name":"IL","marker":{"color":"rgba(102,194,165,1)","line":{"color":"rgba(102,194,165,1)"}},"line":{"color":"rgba(102,194,165,1)"},"xaxis":"x","yaxis":"y","frame":null},{"fillcolor":"rgba(252,141,98,0.5)","x":[16.115679700000001,27.359786199999999,22.846814500000001,13.4643978,12.981963500000001,27.830624100000001,19.8002103,15.4562536,13.214982300000001,16.8123574,14.1137248,16.045283000000001,8.5437509899999995,13.2391267,15.574275699999999,13.921367500000001,15.581854,21.197014500000002,17.167662799999999,18.372342499999998,11.4249881,20.549892799999999,11.145299100000001,12.993598799999999,13.929867,15.50432,15.538167100000001,14.9522958,42.131149899999997,20.489939400000001,13.1074407,24.220034500000001,13.257682300000001,20.229814399999999,16.973138599999999,13.1423129,14.8558462,12.771798,17.546090299999999,10.1458975,22.308069,19.975747800000001,19.262915100000001,11.1118012,17.668613799999999,17.1792531,13.1476522,16.401997999999999,26.7446886,17.777526300000002,13.5396226,14.4075703,37.742295400000003,16.925227700000001,14.679814199999999,12.1746236,12.6387629,10.7029216,9.7882708800000007,11.164917900000001,14.612900099999999,11.042294800000001,13.842852000000001,24.455887000000001,17.210682500000001,14.171055900000001,15.734664,12.6200972,13.5281456,12.8463697,24.611668999999999,10.589586499999999,14.7000195,14.133823599999999,10.014025200000001,18.608020400000001,15.4816696,9.4715852399999996,36.245444599999999,15.421938900000001,12.644985200000001,21.758517399999999,12.2726866,22.723011799999998,16.080516200000002,13.399963,23.815566799999999,10.8145974,15.5891252,18.565503799999998,16.583834700000001,15.809775999999999],"type":"box","orientation":"h","name":"IN","marker":{"color":"rgba(252,141,98,1)","line":{"color":"rgba(252,141,98,1)"}},"line":{"color":"rgba(252,141,98,1)"},"xaxis":"x","yaxis":"y","frame":null},{"fillcolor":"rgba(141,160,203,0.5)","x":[14.115092300000001,16.2755866,18.0660208,18.9337962,19.039802999999999,11.8278471,14.5760743,17.251975399999999,18.225824500000002,21.420856799999999,23.742011000000002,16.066701999999999,21.488519199999999,15.8443516,22.652725100000001,14.6477089,16.939765699999999,12.041948700000001,22.864736300000001,18.7787018,18.912403999999999,20.4206544,26.978781900000001,26.872568099999999,20.1454244,11.433138700000001,21.173081499999999,30.9753249,16.444129199999999,16.468469800000001,24.765087699999999,14.3082727,36.760061899999997,15.116835,16.234239899999999,15.4575777,27.2497358,21.205782599999999,34.557185699999998,11.4555097,28.6383762,14.4522145,11.3134379,16.154235499999999,32.596387200000002,18.7880617,27.586635900000001,14.4056678,15.2878703,20.686691100000001,16.252821699999998,26.763553999999999,18.540128599999999,25.0460405,15.084171,35.608836500000002,13.280021,17.429609599999999,14.160017,13.4575569,19.043321299999999,15.6946934,36.963511400000002,16.902409599999999,11.656838199999999,15.9567602,13.665839399999999,12.921038100000001,20.021130500000002,26.9656935,13.893376399999999,13.363353,19.708129400000001,17.641192,17.0117257,13.7970398,14.5667198,17.2912268,14.124310100000001,17.804744299999999,48.078510199999997,19.410403599999999,18.232210599999998],"type":"box","orientation":"h","name":"MI","marker":{"color":"rgba(141,160,203,1)","line":{"color":"rgba(141,160,203,1)"}},"line":{"color":"rgba(141,160,203,1)"},"xaxis":"x","yaxis":"y","frame":null},{"fillcolor":"rgba(231,138,195,0.5)","x":[8.74173036,17.366060399999999,17.266945499999999,13.243539500000001,29.1494085,16.176470599999998,14.1576729,11.4336901,24.2252343,11.323289000000001,13.912174800000001,17.784991999999999,19.689345400000001,15.763120799999999,13.0905778,11.6793426,14.258027,25.085388200000001,13.475094,18.188161900000001,31.594057299999999,18.7380268,21.077387399999999,11.8740898,32.204593000000003,16.4765579,14.9341366,31.627997700000002,31.956731999999999,13.5143719,29.788310899999999,24.4504965,16.0309861,10.5537945,15.258975100000001,12.311271100000001,12.85435,9.3307086600000009,13.4497842,10.984531799999999,13.8431503,16.771139000000002,23.682805500000001,12.208368399999999,18.179368499999999,13.3233757,18.8616572,23.550428499999999,13.3788082,18.175797299999999,15.0270375,23.702606500000002,11.677498,14.1000841,19.2777119,10.513927000000001,26.550480400000001,11.3808463,12.105140499999999,15.3234543,8.8458880400000002,19.338308999999999,11.4884393,10.1076709,13.0943276,12.444532799999999,21.881875099999998,11.233264,15.7080088,16.7975615,14.115657499999999,16.282409699999999,13.777260800000001,15.6221022,17.376210499999999,18.989604100000001,24.733139300000001,15.5998451,13.083417900000001,16.9825108,15.1100169,7.9132557800000001,24.419351800000001,19.009675600000001,18.445430900000002,14.498714700000001,29.095110200000001,13.710744399999999],"type":"box","orientation":"h","name":"OH","marker":{"color":"rgba(231,138,195,1)","line":{"color":"rgba(231,138,195,1)"}},"line":{"color":"rgba(231,138,195,1)"},"xaxis":"x","yaxis":"y","frame":null},{"fillcolor":"rgba(166,216,84,0.5)","x":[12.427491699999999,18.320015600000001,19.425146999999999,25.822892299999999,26.2931785,17.9412424,13.6760641,19.780324700000001,18.153336299999999,13.846310000000001,20.852312999999999,16.599468999999999,43.626450900000002,15.925463799999999,22.488341299999998,20.994087199999999,26.2870159,29.8544673,15.603532899999999,20.8318653,13.5699001,21.680384100000001,19.875177600000001,17.305067099999999,20.483250999999999,18.731729300000001,15.324074100000001,22.165632299999999,14.3912738,20.328242199999998,14.390958599999999,30.4885126,16.4620371,13.631794599999999,17.441794300000002,19.071148099999998,21.877375000000001,15.4275441,14.0016473,7.3361082199999998,25.355833700000002,17.372421299999999,13.4311741,21.9338239,24.857825099999999,37.419779800000001,15.749235499999999,24.464372000000001,18.5920497,24.634327500000001,15.527175,22.906513100000002,17.499336799999998,19.906440199999999,16.7559769,28.588086700000002,19.833921,17.9479167,14.8077953,20.837192600000002,15.0650908,17.551657899999999,18.942131100000001,19.2118611,23.1569039,19.016887199999999,23.3909001,35.396784099999998,16.549868799999999,15.064584,24.995503599999999,21.666381699999999],"type":"box","orientation":"h","name":"WI","marker":{"color":"rgba(166,216,84,1)","line":{"color":"rgba(166,216,84,1)"}},"line":{"color":"rgba(166,216,84,1)"},"xaxis":"x","yaxis":"y","frame":null}],"highlight":{"on":"plotly_click","persistent":false,"dynamic":false,"selectize":false,"opacityDim":0.20000000000000001,"selected":{"opacity":1},"debounce":0},"shinyEvents":["plotly_hover","plotly_click","plotly_selected","plotly_relayout","plotly_brushed","plotly_brushing","plotly_clickannotation","plotly_doubleclick","plotly_deselect","plotly_afterplot","plotly_sunburstclick"],"base_url":"https://plot.ly"},"evals":[],"jsHooks":[]}</script> <p>Simply printing the plot object will render the chart locally in your web browser or in the <code>RStudio</code> viewer.</p> <p>Graphs created with the <code>plotly</code> R package are interactive!</p> <p>Click on legend entries to hide/show traces, click-and-drag on the chart to zoom, double-click to autoscale, shift-and-drag to pan.</p> <h2>Next Steps</h2> <p>Once you have installed the <code>plotly</code> R package, learn more about the <a href="https://plotly.com/r/plotly-fundamentals/">fundamentals of making charts</a> and start making <a href="https://plotly.com/r/basic-charts/">basic charts</a>.</p> <h3>What About Dash?</h3> <p><a href="https://dashr.plot.ly/">Dash for R</a> is an open-source framework for building analytical applications, with no Javascript required, and it is tightly integrated with the Plotly graphing library. </p> <p>Learn about how to install Dash for R at https://dashr.plot.ly/installation.</p> <p>Everywhere in this page that you see <code>fig</code>, you can display the same figure in a Dash for R application by passing it to the <code>figure</code> argument of the <a href="https://dashr.plot.ly/dash-core-components/graph"><code>Graph</code> component</a> from the built-in <code>dashCoreComponents</code> package like this:</p> <div class="highlight"><pre><code class="language-r" data-lang="r"><span class="n">library</span><span class="p">(</span><span class="n">plotly</span><span class="p">)</span><span class="w"> </span><span class="n">fig</span><span class="w"> </span><span class="o"><-</span><span class="w"> </span><span class="n">plot_ly</span><span class="p">()</span><span class="w"> </span><span class="c1"># fig <- fig %>% add_trace( ... )</span><span class="w"> </span><span class="c1"># fig <- fig %>% layout( ... ) </span><span class="w"> </span><span class="n">library</span><span class="p">(</span><span class="n">dash</span><span class="p">)</span><span class="w"> </span><span class="n">library</span><span class="p">(</span><span class="n">dashCoreComponents</span><span class="p">)</span><span class="w"> </span><span class="n">library</span><span class="p">(</span><span class="n">dashHtmlComponents</span><span class="p">)</span><span class="w"> </span><span class="n">app</span><span class="w"> </span><span class="o"><-</span><span class="w"> </span><span class="n">Dash</span><span class="o">$</span><span class="n">new</span><span class="p">()</span><span class="w"> </span><span class="n">app</span><span class="o">$</span><span class="n">layout</span><span class="p">(</span><span class="w"> </span><span class="n">htmlDiv</span><span class="p">(</span><span class="w"> </span><span class="nf">list</span><span class="p">(</span><span class="w"> </span><span class="n">dccGraph</span><span class="p">(</span><span class="n">figure</span><span class="o">=</span><span class="n">fig</span><span class="p">)</span><span class="w"> </span><span class="p">)</span><span class="w"> </span><span class="p">)</span><span class="w"> </span><span class="p">)</span><span class="w"> </span><span class="n">app</span><span class="o">$</span><span class="n">run_server</span><span class="p">(</span><span class="n">debug</span><span class="o">=</span><span class="kc">TRUE</span><span class="p">,</span><span class="w"> </span><span class="n">dev_tools_hot_reload</span><span class="o">=</span><span class="kc">FALSE</span><span class="p">)</span><span class="w"> </span></code></pre></div> </section>  </section> </div> </main> <script> var array = []; $('.tutorial-content :header:not(h6)').each(function (i, e) { var item = $(e); var itemText = item.text(); var hash = itemText.replace(/[^a-z0-9\s]/gi, '').replace(/[_\s]/g, '-').replace(/^-+|-+$/g, '').toLowerCase(); item.attr("id", hash); array.push({text: itemText, tag: item.prop("tagName"), hash: hash}); }); $("#nav_header_insertion_list").html(array.map(function(entry) { var text = entry.text.replace(/[^a-z0-9\s\.:\-\?\!)]/gi, ''); if(entry.tag.toLowerCase() < "h4"){ return('<li class="--sidebar-item"><a href="#' + entry.hash + '">' + text + '</a></li>'); } else { return('<li class="--sidebar-item"><a href="#' + entry.hash + '">' + text + '</a></li>'); } }).join("")); //$(".tutorial-content :header:not(h6)").append( "\<div class=\"icon copy\" data-tooltip=\"Click to copy direct link\"><svg style=\"width:24px;height:24px\" viewBox=\"0 0 24 24\"><path fill=\"#000000\" d=\"M10.59,13.41C11,13.8 11,14.44 10.59,14.83C10.2,15.22 9.56,15.22 9.17,14.83C7.22,12.88 7.22,9.71 9.17,7.76V7.76L12.71,4.22C14.66,2.27 17.83,2.27 19.78,4.22C21.73,6.17 21.73,9.34 19.78,11.29L18.29,12.78C18.3,11.96 18.17,11.14 17.89,10.36L18.36,9.88C19.54,8.71 19.54,6.81 18.36,5.64C17.19,4.46 15.29,4.46 14.12,5.64L10.59,9.17C9.41,10.34 9.41,12.24 10.59,13.41M13.41,9.17C13.8,8.78 14.44,8.78 14.83,9.17C16.78,11.12 16.78,14.29 14.83,16.24V16.24L11.29,19.78C9.34,21.73 6.17,21.73 4.22,19.78C2.27,17.83 2.27,14.66 4.22,12.71L5.71,11.22C5.7,12.04 5.83,12.86 6.11,13.65L5.64,14.12C4.46,15.29 4.46,17.19 5.64,18.36C6.81,19.54 8.71,19.54 9.88,18.36L13.41,14.83C14.59,13.66 14.59,11.76 13.41,10.59C13,10.2 13,9.56 13.41,9.17Z\"/> </svg> </div>"); </script> <footer class="--footer-main"> <section class="--footer-top"> <div class="--wrap"> <ul class="--footer-body"> <li class="--footer-column"> <h6 style="color:#119dff" class="--footer-heading">JOIN OUR MAILING LIST</h6>			 <ul> 				 <li> <p class="subscribe-text"> Sign up to stay in the loop with all things Plotly — from Dash Club to product updates, webinars, and more!</p> <a href="https://go.plot.ly/subscription" class="subscribe-button" target="_blank"> Subscribe </a> </li> </ul> </li> 		 <li class="--footer-column"> <h6 style="color:#e763fa" class="--footer-heading">Products</h6>			 <ul> <li><a href="https://plotly.com/dash/" target="_self">Dash</a></li> 				 				 <li><a href="https://plotly.com/consulting-and-oem/" target="_self">Consulting and Training</a></li> </ul> </li> 		 <li class="--footer-column"> <h6 style="color:#636efa" class="--footer-heading">Pricing</h6>			 <ul> <li><a href="https://plotly.com/get-pricing/" target="_self">Enterprise Pricing</a></li> 				 </ul> </li> 		 <li class="--footer-column"> <h6 style="color:#00cc96" class="--footer-heading">About Us</h6>			 <ul> <li><a href="https://plotly.com/careers" target="_self">Careers</a></li> 				 <li><a href="https://plotly.com/resources/" target="_self">Resources</a></li> 				 <li><a href="https://medium.com/@plotlygraphs" target="_self">Blog</a></li> 				 </ul> </li> 		 <li class="--footer-column"> <h6 style="color:#EF553B" class="--footer-heading">Support</h6>			 <ul> <li><a href="https://community.plot.ly/" target="_self">Community Support</a></li> 				 <li><a href="https://plotly.com/graphing-libraries" target="_self">Documentation</a></li> 				 </ul> </li> </ul> </div> </section> <section class="--footer-meta"> <div class="--wrap"> <div class="left"> <article class="--copyright">Copyright © 2024 Plotly. All rights reserved.</article> </div> <div class="right"> <article class="--tos"><a href="https://community.plotly.com/tos" target="_blank">Terms of Service</a> </article> <article class="--privacy"><a href="https://plotly.com/privacy/" target="_blank">Privacy Policy</a> </article> </div> </div> <div id="markprompt" /> </section> </footer> <div class="modal" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> <div class="modal-dialog" role="document"> <div class="modal-content" id="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> <span style="float: left; padding-top:13px; padding-right:10px;"><i class="fa fa-search fa-lg"></i></span> <input id="search-input" class="search-input" type="text" placeholder="" /> </div> <div class="modal-body" id="modal-body"> <div id="search-results" class="search-results"> <div id="primary-search-results" class="primary-search-results"></div> <div id="schema-search-results" class="schema-search-results"></div> </div> </div> </div> </div> </div> <script> window.plotly_doc_language = "r"; </script>  <script> window.ALGOLIA_CONFIG = { 'applicationId': '7EK9KHJW8M', 'indexName': 'r_docs', 'apiKey': '4dae07ded6a721de73bde7356eec9280', 'baseurl': '/' } </script> <script id="algolia__template" type="text/template"> <div class="algolia__result"> <a class="algolia__result-link" onClick="$('#myModal').modal('toggle')" href="/{{ permalink }}">{{{ _highlightResult.name.value }}}</a> <div class="algolia__result-text">{{{ _highlightResult.description.value }}}</div> </div> </script> <script id="algolia__secondary-template" type="text/template"> <div class="algolia__secondary-result"> <a class="algolia__result-link" onClick="$('#myModal').modal('toggle')" href="/{{ permalink }}">{{{ _highlightResult.name.value }}}</a> <div class="algolia__result-text">{{{ _highlightResult.description.value }}}</div> </div> </script> <script id="algolia__template--no-results" type="text/template">No results found.</script> <script src="//cdn.jsdelivr.net/hogan.js/3.0.2/hogan.min.js"></script> <script src="/all_static/javascripts/algolia/algolia.js"></script>  <script src="/all_static//javascripts/hash_offset.js"></script>  <script src="/all_static/javascripts/imghover.js"></script> <script src="/all_static/javascripts/improve.js?version=2024-11-28-17-16"></script>   <script src="/all_static/javascripts/highlight/highlight.min.js"></script> <script src="/all_static/javascripts/highlight/julia.min.js"></script> <script src="/all_static/javascripts/highlight.line-numbers.js"></script> </body> </html>

CINXE.COM

Getting started with plotly in R