master

分支 (3)

管理

管理

master

dependabot/npm_and_yarn/HtmlWidget/backgroundMapTile_files/leaflet-providers-1.1.17/mversion-2.0.0

dependabot/npm_and_yarn/HtmlWidget/backgroundMapTile_files/leaflet-providers-1.1.17/eslint-6.5.1

R-graph-gallery
/
correlogram.html

<!DOCTYPE html>
<html lang="en">

  <head>

    <!-- Google Analytics + OutboundLink + Google Adsense -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=UA-79254642-1"></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      gtag('js', new Date());

      gtag('config', 'UA-79254642-1');
    </script>
    <script>
    var getOutboundLink = function(url) {
      gtag('event', 'click', {
        'event_category': 'outbound',
        'event_label': url,
        'transport_type': 'beacon',
        'event_callback': function(){document.location = url;}
      });
    }
    </script>
    <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
    <script>
         (adsbygoogle = window.adsbygoogle || []).push({
              google_ad_client: "ca-pub-3523953066677938",
              enable_page_level_ads: true
         });
    </script>
    <!-- Google Analytics + OutboundLink + Google Adsense -->


    <meta charset="utf-8">
    <title>Correlogram</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="A correlogram displays the relationship between each pair of numeric variable of a dataset. Find out how to build it with R, through several examples with explanation and reproducible code.">
    <meta name="keywords" content="Data,Dataviz,Datavisualization,Javascript,D3,D3.js,Correlogram">
    <meta name="author" content="Yan Holtz">
    <link rel="icon" href="img/logo/R_single_small.png">

    <meta property="og:title" content="Correlogram &#8211; The R graph gallery">
    <meta property="og:image" content="img/overview_RGG.png">
    <meta property="og:description" content="A correlogram displays the relationship between each pair of numeric variable of a dataset. Find out how to build it with R, through several examples with explanation and reproducible code.">

    <!-- Bootstrap core CSS -->
    <link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">

    <!-- Custom fonts for this template -->
    <link href="vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">


    <!-- Custom styles for this template -->
    <link href="css/agency.css" rel="stylesheet">

    <!-- JQUERY -->
    <script src="vendor/jquery/jquery.min.js"></script>

  </head>

  <body id="page-top">


    <!-- THIS ALLOWS TO INSERT THE MENU THAT IS STORED IN A MENU.HTML FILE-->
    <nav class="navbar navbar-expand-lg fixed-top" id="mainNav"></nav>
    <script>
    $(function(){
      $("#mainNav").load("html_chunk/menu.html");
    });
    </script>

    <!-- THIS ALLOWS TO INSERT THE MODAL OF THE MENU THAT IS STORED IN A MENU_MODAL.HTML FILE-->
    <div id="modal_menu_insertion"> </div>
    <script>
    $(function(){
      $("#modal_menu_insertion").load("html_chunk/menu_modal.html");
    });
    </script>

      <!-- Header -->
      <header class="masthead" style="padding-top: 150px; padding-bottom: 80px">
        <div class="textlanding">
          <h1>Correlogram</h1>
          <hr class="short_hr">
          <br>
          <ul class="list-inline social-buttons">
            <li class="list-inline-item">
              <a href="https://twitter.com/R_Graph_Gallery">
                <i class="fa fa-twitter"></i>
              </a>
            </li>
            <li class="list-inline-item social-buttons">
              <a href="https://github.com/holtzy">
                <i class="fa fa-github" style="color: white"></i>
              </a>
            </li>
            <li class="list-inline-item social-buttons">
              <a href="https://www.linkedin.com/in/yan-holtz-2477534a/">
                <i class="fa fa-linkedin"></i>
              </a>
            </li>
          </ul>
          <br><br>
          <p style="max-width: 700px; margin: auto">A <a href="https://www.data-to-viz.com/graph/correlogram.html">correlogram</a> or correlation matrix allows to analyse the relationship between each pair of numeric variables in a dataset. It gives a quick overview of the whole dataset. It is more used for <u>exploratory</u> purpose than <u>explanatory</u>.</p>
      </div>
    </header>


    <!-- THIS ALLOWS TO INSERT THE ADVERTISEMENT BANNER THAT IS STORED IN A BANNER.HTML FILE-->
    <div id="position_for_images"> </div>
    <script>
    $(function(){
      $("#position_for_images").load("html_chunk/images.html");
    });
    </script>


<!-- ======================== PORTFOLIO SECTION ============================ -->
<!-- Images must be 480 x 480, resize them with ./script_reformat_img.sh output_name.png -->
<section class="bg" id="portfolio" style="padding-top: 10px">
  <div class="container">

    <div class="mySeryTitle">Using the <code>GGally</code> package</div>
    <hr>
    <p>The <code>GGally</code> package offers great options to build <a href="https://www.data-to-viz.com/graph/correlogram.html">correlograms</a>. The <code>ggpairs()</code> function build a <a href="199-correlation-matrix-with-ggally.html">classic correlogram</a> with scatterplot, correlation coefficient and variable distribution. On top of that, it is possible to inject <a href="ggplot2-package.html">ggplot2</a> code, for instance to <a href="199-correlation-matrix-with-ggally.html#category">color categories</a>.</p>
    <div id="portfolio-items" class="row">
      <div class="col-md-4 col-sm-6 portfolio-item">
        <a class="portfolio-link" href="199-correlation-matrix-with-ggally.html">
          <div class="portfolio-hover">
            <div class="portfolio-hover-content">
              <p>Scatterplot matrix</p>
              <hr>
              <p class="explanation_portfolio">Basic scatteprlot matrix with the ggpairs() function.</p>
            </div>
          </div>
          <img class="img-fluid imgOfPortfolio" src="img/graph/199-correlation-matrix-with-ggally1.png" alt="">
        </a>
      </div>
      <div class="col-md-4 col-sm-6 portfolio-item">
        <a class="portfolio-link" href="199-correlation-matrix-with-ggally.html">
          <div class="portfolio-hover">
            <div class="portfolio-hover-content">
              <p>Pearson correlation</p>
              <hr>
              <p class="explanation_portfolio">Visualize correlation with ggcorr().</p>
            </div>
          </div>
          <img class="img-fluid imgOfPortfolio" src="img/graph/199-correlation-matrix-with-ggally2.png" alt="">
        </a>
      </div>
      <div class="col-md-4 col-sm-6 portfolio-item">
        <a class="portfolio-link" href="199-correlation-matrix-with-ggally.html">
          <div class="portfolio-hover">
            <div class="portfolio-hover-content">
              <p>Show groups</p>
              <hr>
              <p class="explanation_portfolio">You can use the ggplot2 syntax to add aesthetics and ths map color to categories.</p>
            </div>
          </div>
          <img class="img-fluid imgOfPortfolio" src="img/graph/199-correlation-matrix-with-ggally3.png" alt="">
        </a>
      </div>
    </div>

    <br><br>


    <div class="mySeryTitle">Using the <code>corrgram</code> package</div>
    <hr>
    <p>The <code>corrgram</code> is another great alternative to build <a href="https://www.data-to-viz.com/graph/correlogram.html">correlograms</a>. You can choose what to display in the upper, lower and diagonal part of the figure: scatterplot, pie chart, text, ellipse and more.</p>
    <div id="portfolio-items" class="row">
      <div class="col-md-4 col-sm-6 portfolio-item">
        <a class="portfolio-link" href="115-study-correlations-with-a-correlogram.html">
          <div class="portfolio-hover">
            <div class="portfolio-hover-content">
              <p>Square and Pie</p>
              <hr>
              <p class="explanation_portfolio">How to use the corrgram() function to represent correlation with square and pie charts.</p>
            </div>
          </div>
          <img class="img-fluid imgOfPortfolio" src="img/graph/115-study-correlations-with-a-correlogram.png" alt="">
        </a>
      </div>
      <div class="col-md-4 col-sm-6 portfolio-item">
        <a class="portfolio-link" href="115-study-correlations-with-a-correlogram.html">
          <div class="portfolio-hover">
            <div class="portfolio-hover-content">
              <p>Ellipse + Scatterplot</p>
              <hr>
              <p class="explanation_portfolio">Visualize correlation with corrgram(). Use ellipses and scatterplots</p>
            </div>
          </div>
          <img class="img-fluid imgOfPortfolio" src="img/graph/115-study-correlations-with-a-correlogram2.png" alt="">
        </a>
      </div>
      <div class="col-md-4 col-sm-6 portfolio-item">
        <a class="portfolio-link" href="115-study-correlations-with-a-correlogram.html">
          <div class="portfolio-hover">
            <div class="portfolio-hover-content">
              <p>Half matrix</p>
              <hr>
              <p class="explanation_portfolio">You can display correlation in half the matrix only.</p>
            </div>
          </div>
          <img class="img-fluid imgOfPortfolio" src="img/graph/115-study-correlations-with-a-correlogram3.png" alt="">
        </a>
      </div>
    </div>

    <br><br>

    <div class="mySeryTitle">Other methods</div>
    <hr>
    <p>Lesser known ways to build correlogram with R, like the <code>ellipse</code> package, the <code>plot()</code> function and the <code>car</code> package.</p>
    <div id="portfolio-items" class="row">
      <div class="col-md-4 col-sm-6 portfolio-item">
        <a class="portfolio-link" href="97-correlation-ellipses.html">
          <div class="portfolio-hover">
            <div class="portfolio-hover-content">
              <p>Ellipse package</p>
              <hr>
              <p class="explanation_portfolio">The ellipse package allows to visualize a correlation matrix with ellipses.</p>
            </div>
          </div>
          <img class="img-fluid imgOfPortfolio" src="img/graph/97-correlation-ellipses.png" alt="">
        </a>
      </div>
      <div class="col-md-4 col-sm-6 portfolio-item">
        <a class="portfolio-link" href="98-basic-scatterplot-matrix.html">
          <div class="portfolio-hover">
            <div class="portfolio-hover-content">
              <p>plot() function</p>
              <hr>
              <p class="explanation_portfolio">The plot function is straightforward way to build a basic scatterplot matrix.</p>
            </div>
          </div>
          <img class="img-fluid imgOfPortfolio" src="img/graph/98-basic-scatterplot-matrix.png" alt="">
        </a>
      </div>
      <div class="col-md-4 col-sm-6 portfolio-item">
        <a class="portfolio-link" href="99-scatterplot-matrix-car-package.html">
          <div class="portfolio-hover">
            <div class="portfolio-hover-content">
              <p>car package</p>
              <hr>
              <p class="explanation_portfolio">The car package probides a scatterplotMatrix function to build correlogram.</p>
            </div>
          </div>
          <img class="img-fluid imgOfPortfolio" src="img/graph/99-scatterplot-matrix-car-package.png" alt="">
        </a>
      </div>
    </div>

 </div>
</section>


<!-- ======================================================================= -->


<!-- ============================ RELATED SECTION ============================ -->
<section class="bg-light" id="portfolio_landing" style="padding-top: 30px; padding-bottom: 30px; margin-top: 100px;">

<div class="container">

  <p class="mySeryTitle">Related chart types</p>
  <hr>
  <div class="row">
    <div class="col-md-2 col-sm-4 portfolio-item ">
      <a class="portfolio-link"  href="scatterplot.html">
        <div class="portfolio-hover">
          <div class="portfolio-hover-content">
            <i class="fa fa-plus fa-3x"></i>
          </div>
        </div>
        <img class="img-fluid" src="img/section/ScatterPlot150.png" alt="">
      </a>
      <div class="captionPortfolio">Scatter</div>
    </div>
    <div class="col-md-2 col-sm-4 portfolio-item">
      <a class="portfolio-link"  href="heatmap.html">
        <div class="portfolio-hover">
          <div class="portfolio-hover-content">
            <i class="fa fa-plus fa-3x"></i>
          </div>
        </div>
        <img class="img-fluid" src="img/section/Heatmap150.png" alt="">
      </a>
      <div class="captionPortfolio">Heatmap</div>
    </div>
    <div class="col-md-2 col-sm-4 portfolio-item">
      <a class="portfolio-link"  href="correlogram.html">
        <div class="portfolio-hover">
          <div class="portfolio-hover-content">
            <i class="fa fa-plus fa-3x"></i>
          </div>
        </div>
        <img class="img-fluid" src="img/section/Correlogram150.png" alt="">
      </a>
      <div class="captionPortfolio">Correlogram</div>
    </div>
    <div class="col-md-2 col-sm-4 portfolio-item">
      <a class="portfolio-link"  href="bubble-chart.html">
        <div class="portfolio-hover">
          <div class="portfolio-hover-content">
            <i class="fa fa-plus fa-3x"></i>
          </div>
        </div>
        <img class="img-fluid" src="img/section/BubblePlot150.png" alt="">
      </a>
      <div class="captionPortfolio">Bubble</div>
    </div>
    <div class="col-md-2 col-sm-4 portfolio-item ">
      <a class="portfolio-link"  href="connected-scatterplot.html">
        <div class="portfolio-hover">
          <div class="portfolio-hover-content">
            <i class="fa fa-plus fa-3x"></i>
          </div>
        </div>
        <img class="img-fluid" src="img/section/ScatterConnected150.png" alt="">
      </a>
      <div class="captionPortfolio">Connected scatter</div>
    </div>
    <div class="col-md-2 col-sm-4 portfolio-item show column correlation numonly bigdata">
      <a class="portfolio-link"  href="2d-density-chart.html">
        <div class="portfolio-hover">
          <div class="portfolio-hover-content">
            <i class="fa fa-plus fa-3x"></i>
          </div>
        </div>
        <img class="img-fluid" src="img/section/2dDensity150.png" alt="">
      </a>
      <div class="captionPortfolio">Density 2d</div>
    </div>
  </div>

</div>
</section>


<!-- ============================ CONTACT SECTION ============================ -->

<!-- ANCHOR -->
<a name="contactanchor"></a>

<section id="contact" class="bg" style="background-color: white"></section>

<!-- THIS ALLOWS TO INSERT THE CONTACT CHUNK THAT IS STORED IN A CONTACT.HTML FILE-->
<script>
$(function(){
  $("#contact").load("html_chunk/contact.html");
});
</script>


<!-- ============================ FOOTER SECTION ============================ -->
<footer class="bg-light" id="myFooter"></footer>

<!-- THIS ALLOWS TO INSERT THE FOOTER THAT IS STORED IN A FOOTER.HTML FILE-->
<script>
$(function(){
  $("#myFooter").load("html_chunk/footer.html");
});
</script>

<!-- ============================ -->


<!-- ========================================== JAVASCRIPT SECTION ===========================================================- -->


    <!-- Bootstrap core JavaScript -->
    <script src="vendor/jquery/jquery.min.js"></script>
    <script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>

    <!-- Plugin JavaScript -->
    <script src="vendor/jquery-easing/jquery.easing.min.js"></script>

    <!-- Custom scripts for this template -->
    <script src="js/agency.min.js"></script>


<!--===========================================================- -->


  </body>

</html>