Sync docs from master to gh-pages
This commit is contained in:
buildmaster
170
reference/html/overview.html
Normal file
170
reference/html/overview.html
Normal file
@@ -0,0 +1,170 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<!--[if IE]><meta http-equiv="X-UA-Compatible" content="IE=edge"><![endif]-->
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="generator" content="Asciidoctor 1.5.8">
|
||||
<title>Overview</title>
|
||||
<link rel="stylesheet" href="css/spring.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
|
||||
|
||||
<style>
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.switch {
|
||||
border-width: 1px 1px 0 1px;
|
||||
border-style: solid;
|
||||
border-color: #7a2518;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.switch--item {
|
||||
padding: 10px;
|
||||
background-color: #ffffff;
|
||||
color: #7a2518;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.switch--item:not(:first-child) {
|
||||
border-width: 0 0 0 1px;
|
||||
border-style: solid;
|
||||
border-color: #7a2518;
|
||||
}
|
||||
|
||||
.switch--item.selected {
|
||||
background-color: #7a2519;
|
||||
color: #ffffff;
|
||||
}
|
||||
</style>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/zepto/1.2.0/zepto.min.js"></script>
|
||||
<script type="text/javascript">
|
||||
function addBlockSwitches() {
|
||||
$('.primary').each(function() {
|
||||
primary = $(this);
|
||||
createSwitchItem(primary, createBlockSwitch(primary)).item.addClass("selected");
|
||||
primary.children('.title').remove();
|
||||
});
|
||||
$('.secondary').each(function(idx, node) {
|
||||
secondary = $(node);
|
||||
primary = findPrimary(secondary);
|
||||
switchItem = createSwitchItem(secondary, primary.children('.switch'));
|
||||
switchItem.content.addClass('hidden');
|
||||
findPrimary(secondary).append(switchItem.content);
|
||||
secondary.remove();
|
||||
});
|
||||
}
|
||||
|
||||
function createBlockSwitch(primary) {
|
||||
blockSwitch = $('<div class="switch"></div>');
|
||||
primary.prepend(blockSwitch);
|
||||
return blockSwitch;
|
||||
}
|
||||
|
||||
function findPrimary(secondary) {
|
||||
candidate = secondary.prev();
|
||||
while (!candidate.is('.primary')) {
|
||||
candidate = candidate.prev();
|
||||
}
|
||||
return candidate;
|
||||
}
|
||||
|
||||
function createSwitchItem(block, blockSwitch) {
|
||||
blockName = block.children('.title').text();
|
||||
content = block.children('.content').first().append(block.next('.colist'));
|
||||
item = $('<div class="switch--item">' + blockName + '</div>');
|
||||
item.on('click', '', content, function(e) {
|
||||
$(this).addClass('selected');
|
||||
$(this).siblings().removeClass('selected');
|
||||
e.data.siblings('.content').addClass('hidden');
|
||||
e.data.removeClass('hidden');
|
||||
});
|
||||
blockSwitch.append(item);
|
||||
return {'item': item, 'content': content};
|
||||
}
|
||||
|
||||
function globalSwitch() {
|
||||
$('.switch--item').each(function() {
|
||||
$(this).off('click');
|
||||
$(this).on('click', function() {
|
||||
selectedText = $(this).text()
|
||||
selectedIndex = $(this).index()
|
||||
$(".switch--item").filter(function() { return ($(this).text() === selectedText) }).each(function() {
|
||||
$(this).addClass('selected');
|
||||
$(this).siblings().removeClass('selected');
|
||||
selectedContent = $(this).parent().siblings(".content").eq(selectedIndex)
|
||||
selectedContent.removeClass('hidden');
|
||||
selectedContent.siblings().addClass('hidden');
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
$(addBlockSwitches);
|
||||
$(globalSwitch);
|
||||
|
||||
</script>
|
||||
|
||||
</head>
|
||||
<body class="book toc2 toc-left">
|
||||
<div id="header">
|
||||
<div id="toc" class="toc2">
|
||||
<div id="toctitle">Table of Contents</div>
|
||||
<ul class="sectlevel1">
|
||||
<li><a href="#_overview">Overview</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div id="content">
|
||||
<div class="sect1">
|
||||
<h2 id="_overview"><a class="link" href="#_overview">Overview</a></h2>
|
||||
<div class="sectionbody">
|
||||
<div class="paragraph">
|
||||
<p>Spring Cloud Sleuth provides Spring Boot auto-configuration for distributed
|
||||
tracing. Underneath, Spring Cloud Sleuth is a layer over a Tracer library named
|
||||
<a href="https://github.com/openzipkin/brave">Brave</a>.</p>
|
||||
</div>
|
||||
<div class="paragraph">
|
||||
<p>Sleuth configures everything you need to get started. This includes where trace
|
||||
data (spans) are reported to, how many traces to keep (sampling), if remote
|
||||
fields (baggage) are sent, and which libraries are traced.</p>
|
||||
</div>
|
||||
<div class="paragraph">
|
||||
<p>We maintain an <a href="https://github.com/openzipkin/sleuth-webmvc-example">example app</a> where two Spring Boot services collaborate on an
|
||||
HTTP request. Sleuth configures these apps, so that timing of these requests are
|
||||
recorded into <a href="https://zipkin.io">Zipkin</a>, a distributed tracing system. Tracing
|
||||
UIs visualize latency, such as time in one service vs waiting for other
|
||||
services.</p>
|
||||
</div>
|
||||
<div class="paragraph">
|
||||
<p>Here’s an example of what it looks like:</p>
|
||||
</div>
|
||||
<div class="imageblock">
|
||||
<div class="content">
|
||||
<img src="https://raw.githubusercontent.com/spring-cloud/spring-cloud-sleuth/master/docs/src/main/asciidoc/images/zipkin-trace.png" alt="Zipkin Traces">
|
||||
</div>
|
||||
</div>
|
||||
<div class="paragraph">
|
||||
<p>The <a href="https://github.com/openzipkin/sleuth-webmvc-example">source repository</a> of this
|
||||
example includes demonstrations ofmany things, including WebFlux and messaging.
|
||||
Most features require only a property or dependency change to work. These
|
||||
snippets showcase the value of Spring Cloud Sleuth: Through auto-configuration,
|
||||
Sleuth make getting started with distributed tracing easy!</p>
|
||||
</div>
|
||||
<div class="paragraph">
|
||||
<p>To keep things simple, the same example is used throughout documentation using
|
||||
basic HTTP communication.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript" src="js/tocbot/tocbot.min.js"></script>
|
||||
<script type="text/javascript" src="js/toc.js"></script>
|
||||
<link rel="stylesheet" href="js/highlight/styles/github.min.css">
|
||||
<script src="js/highlight/highlight.min.js"></script>
|
||||
<script>hljs.initHighlighting()</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user