Merge pull request #26 from influxdata/visualize-data

Visualize data
pull/27/head
Scott Anderson 2019-01-22 21:44:59 -07:00 committed by GitHub
commit 057c620c20
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
23 changed files with 264 additions and 114 deletions

View File

@ -84,3 +84,10 @@ $(".truncate-toggle").click(function(e) {
e.preventDefault()
$(this).closest('.truncate').toggleClass('closed');
})
//////////////////// Replace Missing Images with Placeholder ///////////////////
$(".article--content img").on("error", function() {
$(this).attr("src", "/img/coming-soon.svg");
$(this).attr("style", "max-width:500px;");
});

View File

@ -1,10 +1,10 @@
@font-face {
font-family: 'icomoon';
src: url('fonts/icomoon.eot?cn4x5l');
src: url('fonts/icomoon.eot?cn4x5l#iefix') format('embedded-opentype'),
url('fonts/icomoon.ttf?cn4x5l') format('truetype'),
url('fonts/icomoon.woff?cn4x5l') format('woff'),
url('fonts/icomoon.svg?cn4x5l#icomoon') format('svg');
src: url('fonts/icomoon.eot?rws1o3');
src: url('fonts/icomoon.eot?rws1o3#iefix') format('embedded-opentype'),
url('fonts/icomoon.ttf?rws1o3') format('truetype'),
url('fonts/icomoon.woff?rws1o3') format('woff'),
url('fonts/icomoon.svg?rws1o3#icomoon') format('svg');
font-weight: normal;
font-style: normal;
}
@ -87,6 +87,12 @@
.icon-menu:before {
content: "\e91b";
}
.icon-minus:before {
content: "\e91d";
}
.icon-plus:before {
content: "\e91e";
}
.icon-settings:before {
content: "\e914";
}

View File

@ -1,41 +0,0 @@
---
title: Exploring metrics
description:
menu:
v2_0:
name: Exploring metrics
weight: 1
parent: Placeholder parent
---
Explore and visualize your data in the **Data Explorer**. The user interface allows you to move seamlessly between using the builder or templates and manually editing the query; when possible, the interface automatically populates the builder with the information from your raw query. Choose between [visualization types](/chronograf/latest/guides/visualization-types/) for your query.
To open the **Data Explorer**, click the **Explore** icon in the navigation bar:
<img src="/img/chronograf/v1.7/data-explorer-icon.png" style="width:100%; max-width:400px; margin:2em 0; display: block;">
## Explore data with Flux
Flux is InfluxData's new functional data scripting language designed for querying, analyzing, and acting on time series data. To learn more about Flux, see [Getting started with Flux](/flux/v0.7/introduction/getting-started).
1. Click the **Data Explorer** icon in the sidebar.
2. Use the builder to select from your existing data and have the query automatically formatted for you.
Alternatively, click **Edit Query As Flux** to manually edit the query. To switch back to the query builder, click **Visual Query Builder**.
3. Use the **Functions** pane to review the available Flux functions. Click on a function from the list to add it to your query.
4. Click **Submit** to run your query. You can then preview your graph in the above pane.
## Visualize your query
**To visualize your query**:
* Select a visualization type from the dropdown menu in the upper-left.
<<SCREENSHOT>>
* Select the **Visualization** tab at the bottom of the **Data Explorer**. For details about all of the available visualization options, see [Visualization types](/chronograf/latest/guides/visualization-types/).
## Save your query as a dashboard cell or task
**To save your query**:
1. Click **Save as** in the upper right.
2. Click **Dashboard Cell** to add your query to a dashboard.
3. Click **Task** to save your query as a task.

View File

@ -7,7 +7,7 @@ description: >
menu:
v2_0:
name: Process data
weight: 3
weight: 5
---
InfluxDB's _**task engine**_ is designed for processing and analyzing data.

View File

@ -8,7 +8,7 @@ menu:
weight: 1
---
The `fill()` function replaces all null values in an input stream and replace them with a non-null value.
The `fill()` function replaces all null values in an input stream with a non-null value.
The output stream is the same as the input stream with all null values replaced in the specified column.
_**Function type:** Transformation_

View File

@ -1,15 +0,0 @@
---
title: Managing labels
description: This is just an example post to show the format of new 2.0 posts
menu:
v2_0:
name: Managing labels
weight: 1
parent: Placeholder parent
---
Labels are !!!.
**To view labels**:
* Click the **Configuration** icon in the navigation bar.
* Review the list of labels or enter a search to filter the list of labels.

View File

@ -0,0 +1,15 @@
---
title: Visualize data with InfluxDB
description: >
InfluxDB offers a complete dashboard solution for visualizing your time series data.
Create custom dashboards with flexible queries and visualization types.
menu:
v2_0:
name: Visualize data
weight: 4
---
The InfluxDB user interface provides tools for building custom dashboards to visualize your data.
The following articles outline ways to customize and manage dashboards.
{{< children >}}

View File

@ -1,15 +1,17 @@
---
title: Managing dashboards
description: This is just an example post to show the format of new 2.0 posts
title: Manage InfluxDB dashboards
description: Create, edit, and manage custom dashboards in the InfluxDB user interface (UI).
menu:
v2_0:
name: Managing dashboards
name: Manage dashboards
parent: Visualize data
weight: 1
parent: Placeholder parent
---
Create, edit, and manage dashboards from the **Dashboards** tab in the left navigation.
{{< img-hd src="/img/dashboards-icon.png" title="Dashboard icon" />}}
Variable names changed--instead of dashboard time, it's time range start/time range end (double-check).
Window interval replaces interval
Save as somewhere--same as send to dashboard
@ -17,7 +19,7 @@ Also save as dashboard/save as tasks
Multiple tabs, hide/show tabs, rename tabs
## Creating dashboards
## Create a dashboard
**To create a dashboard**:
@ -25,32 +27,33 @@ Multiple tabs, hide/show tabs, rename tabs
2. Click the **+Create Dashboard** button in the upper right.
3. Enter a name for your dashboard in the **Name this dashboard** field in the upper left.
**To add data to your dashboard**:
#### Add data to your dashboard
1. From your dashboard, click **Add Cell** in the upper right. The Data Explorer overlay opens.
2. Create a query in the Data Explorer following the instructions in <<link to data explorer article>>.
2. Create a query in the Data Explorer following the instructions in [Exlpore metrics](/v2.0/visualize-data/explore-metrics).
3. Enter a name for your cell in the upper left.
4. Click the checkmark icon to save the cell to your dashboard.
You can also send data to your dashboard directly from the Data Explorer. For details, see <<link to data explorer article>>.
**To add a note to your dashboard**:
#### Add a note to your dashboard
1. From your dashboard, click **Add Note** in the upper right.
2. Enter your note in the window that appears. You can use Markdown syntax to format your note.
3. To preview your Markdown formatting, click the **Preview** option.
4. Click **Save**.
## Modifying dashboards
## Modify a dashboard
**To delete a dashboard**:
1. Hover over the dashboard name in the list of dashboards to show options.
2. Click **Delete**.
<<SCREENSHOT>>
3. Click **Confirm** to continue deleting your dashboard.
#### Delete a dashboard
1. Hover over the dashboard name in the list of dashboards to show options.
2. Click **Delete**.
3. Click **Confirm** to continue deleting your dashboard.
**To clone a dashboard**:
* Hover over the dashbaord name in the list of dashboard to show options.
* Click **Clone**.
<<SCREEENSHOT>>
The cloned dashboard opens.
![Delete a dashboard](/img/dashboard-delete.png)
#### Clone a dashboard
1. Hover over the dashbaord name in the list of dashboard to show options.
2. Click **Clone**. The cloned dashboard opens.
![Clone a dashboard](/img/dashboard-clone.png)

View File

@ -0,0 +1,54 @@
---
title: Explore metrics with InfluxDB
description: >
Explore and visualize your data in InfluxDB's Data Explorer.
The InfluxDB user interface (UI) allows you to move seamlessly between using the
Flux builder and manually editing the query.
menu:
v2_0:
name: Explore metrics
parent: Visualize data
weight: 1
---
Explore and visualize your data in the **Data Explorer**.
The InfluxDB user interface (UI) allows you to move seamlessly between using the
Flux builder or templates and manually editing the query.
Choose between [visualization types](/v2.0/visualize-data/visualization-types/) for your query.
To open the **Data Explorer**, click the **Data Explorer** icon in the navigation bar:
{{< img-hd src="/img/data-explorer-icon.png" title="Data Explorer icon" />}}
## Explore data with Flux
Flux is InfluxData's functional data scripting language designed for querying,
analyzing, and acting on time series data.
See [Get started with Flux](/v2.0/query-data/get-started) to learn more about Flux.
1. Click the **Data Explorer** icon in the sidebar.
2. Use the Flux builder in the bottom panel to select a bucket and filters such as measurement, field or tag.
Alternatively, click **Switch to Script Editor** to manually edit the query.
To switch back to the query builder, click **Switch to Query Builder**.
3. Use the **Functions** list to review the available Flux functions.
Click on a function from the list to add it to your query.
4. Click **Submit** to run your query. You can then preview your graph in the above pane.
## Visualize your query
To visualize your query:
1. Select a visualization type from the dropdown menu in the upper-left.
{{< img-hd src="/img/visualization-dropdown.png" title="Visualization dropdown" />}}
2. Select the **Visualization** tab at the bottom of the **Data Explorer**.
For details about all of the available visualization options, see
[Visualization types](/v2.0/visualize-data/visualization-types/).
## Save your query as a dashboard cell or task
**To save your query**:
1. Click **Save as** in the upper right.
2. Click **Dashboard Cell** to add your query to a dashboard.
3. Click **Task** to save your query as a task.

View File

@ -0,0 +1,43 @@
---
title: Manage labels in the InfluxDB UI
description: >
Labels are a way to add visual metadata to dashboards, tasks, and other items
in the InfluxDB UI. View and manage labels in the InfluxDB user interface.
menu:
v2_0:
name: Manage labels
parent: Visualize data
weight: 1
---
Labels are a way to add visual metadata to dashboards, tasks, and other items in the InfluxDB UI.
To manage labels, click the **Configuration** icon in the navigation bar and select **Labels**.
{{< img-hd src="/img/labels-nav-link.png" title="Labels configuration" />}}
#### Create a label
1. Click **+ Create Label**.
2. Enter a **Name** for the label.
3. Select a **Color** for the lable.
4. Enter a description for the label _(Optional)_.
5. Click **Create label**.
#### Edit a label
1. In the label list view, click the name of the label you would like to edit.
The **Edit Label** overlay will appear.
2. Make the desired changes to the label.
3. Click **Save Changes**.
#### Delete a label
1. In the label list view, hover over the label you would like to delete.
2. Click **Delete** in the far right of the label row.
### Add labels to dashboards and tasks
1. In the list view of dashboards or tasks, hover over the item to which you would like to add a label.
2. Click the
<span class="icon-plus" style="color:#fff;background:#22adf6;border-radius:50%;padding:.07rem .1rem;margin:0 .25rem;display: inline-block;width: 20px;height: 20px;"></span>
icon that appears to the right of the name.
The **Manage Labels** overlay will appear.
3. Type the name of the label you would like to add to filter the list of available labels.
Click the label you would like to add. More than one label can be added.
4. Click **Save Changes**.

View File

@ -1,15 +1,15 @@
---
title: Managing sources
description: This is just an example post to show the format of new 2.0 posts
title: Manage sources
description: InfluxDB offers a complete dashboard solution for visualizing your data and monitoring your infrastructure.
menu:
v2_0:
name: Managing sources
name: Manage sources
parent: Visualize data
weight: 1
parent: Placeholder parent
---
Chronograf offers a complete dashboard solution for visualizing your data and monitoring your infrastructure:
InfluxDB offers a complete dashboard solution for visualizing your data and monitoring your infrastructure:
* View [pre-created dashboards](/chronograf/latest/guides/using-precreated-dashboards) from the Host List page. Dashboards are available depending on which Telegraf input plugins you have enabled. These pre-created dashboards cannot be cloned or edited.
* Create custom dashboards from scratch by building queries in the Data Explorer, as described [below](#build-a-dashboard).

View File

@ -1,15 +1,20 @@
---
title: Visualization types
description: This is just an example post to show the format of new 2.0 posts
description: >
InfluxDB dashboards support mulitple visualization types including line graphs,
gauges, tables, and more.
menu:
v2_0:
name: Visualization types
parent: Visualize data
weight: 1
parent: Placeholder parent
---
Chronograf's dashboard views support the following visualization types, which can be selected in the **Visualization Type** selection view of the <<link to data explorer article>>.
[Visualization Type selector](/img/chronograf/chrono-viz-types-selector.png)
The InfluxDB's user interface's (UI) dashboard views support the following visualization types,
which can be selected in the **Visualization Type** selection view of the
[Data Explorer](/v2.0/visualize-data/explore-metrices).
[Visualization Type selector](/img/chrono-viz-types-selector.png)
Each of the available visualization types and available user controls are described below.
@ -22,7 +27,7 @@ Each of the available visualization types and available user controls are descri
* [Gauge](#gauge)
* [Table](#table)
For information on adding and displaying annotations in graph views, see [Adding annotations to Chronograf views](/chronograf/v1.7/guides/annotations/).
For information on adding and displaying annotations in graph views, see [Adding annotations to Chronograf views](/v1.7/guides/annotations/).
### Graphs
@ -32,11 +37,11 @@ There are several types of graphs you can create.
The **Line Graph** view displays a time series in a line graph.
![Line Graph selector](/img/chronograf/chrono-viz-line-graph-selector.png)
![Line Graph selector](/img/chrono-viz-line-graph-selector.png)
##### Line Graph Controls
![Line Graph Controls](/img/chronograf/chrono-viz-line-graph-controls.png)
![Line Graph Controls](/img/chrono-viz-line-graph-controls.png)
Use the **Line Graph Controls** to specify the following:
@ -55,18 +60,18 @@ Use the **Line Graph Controls** to specify the following:
##### Line Graph example
![Line Graph example](/img/chronograf/chrono-viz-line-graph-example.png)
![Line Graph example](/img/chrono-viz-line-graph-example.png)
#### Stacked Graph
The **Stacked Graph** view displays multiple time series bars as segments stacked on top of each other.
![Stacked Graph selector](/img/chronograf/chrono-viz-stacked-graph-selector.png)
![Stacked Graph selector](/img/chrono-viz-stacked-graph-selector.png)
##### Stacked Graph Controls
![Stacked Graph Controls](/img/chronograf/chrono-viz-stacked-graph-controls.png)
![Stacked Graph Controls](/img/chrono-viz-stacked-graph-controls.png)
Use the **Stacked Graph Controls** to specify the following:
@ -85,18 +90,18 @@ Use the **Stacked Graph Controls** to specify the following:
##### Stacked Graph example
![Stacked Graph example](/img/chronograf/chrono-viz-stacked-graph-example.png)
![Stacked Graph example](/img/chrono-viz-stacked-graph-example.png)
### Step Graph
The **Step-Plot Graph** view displays a time series in a staircase graph.
![Step-Plot Graph selector](/img/chronograf/chrono-viz-step-plot-graph-selector.png)
![Step-Plot Graph selector](/img/chrono-viz-step-plot-graph-selector.png)
#### Step Graph Controls
![Step-Plot Graph Controls](/img/chronograf/chrono-viz-step-plot-graph-controls.png)
![Step-Plot Graph Controls](/img/chrono-viz-step-plot-graph-controls.png)
Use the **Step-Plot Graph Controls** to specify the following:
@ -113,7 +118,7 @@ Use the **Step-Plot Graph Controls** to specify the following:
#### Step-Plot Graph example
![Step-Plot Graph example](/img/chronograf/chrono-viz-step-plot-graph-example.png)
![Step-Plot Graph example](/img/chrono-viz-step-plot-graph-example.png)
### Bar Graph
@ -122,11 +127,11 @@ The **Bar Graph** view displays the specified time series using a bar chart.
To select this view, click the Bar Graph selector icon.
![Bar Graph selector](/img/chronograf/chrono-viz-bar-graph-selector.png)
![Bar Graph selector](/img/chrono-viz-bar-graph-selector.png)
#### Bar Graph Controls
![Bar Graph Controls](/img/chronograf/chrono-viz-bar-graph-controls.png)
![Bar Graph Controls](/img/chrono-viz-bar-graph-controls.png)
Use the **Bar Graph Controls** to specify the following:
@ -143,7 +148,7 @@ Use the **Bar Graph Controls** to specify the following:
#### Bar Graph example
![Bar Graph example](/img/chronograf/chrono-viz-bar-graph-example.png)
![Bar Graph example](/img/chrono-viz-bar-graph-example.png)
### Line Graph + Single Stat
@ -152,11 +157,11 @@ The **Line Graph + Single Stat** view displays the specified time series in a li
To select this view, click the **Line Graph + Single Stat** view option.
![Line Graph + Single Stat selector](/img/chronograf/chrono-viz-line-graph-single-stat-selector.png)
![Line Graph + Single Stat selector](/img/chrono-viz-line-graph-single-stat-selector.png)
#### Line Graph + Single Stat Controls
![Line Graph + Single Stat Controls](/img/chronograf/chrono-viz-line-graph-single-stat-controls.png)
![Line Graph + Single Stat Controls](/img/chrono-viz-line-graph-single-stat-controls.png)
Use the **Line Graph + Single Stat Controls** to specify the following:
@ -173,13 +178,13 @@ Use the **Line Graph + Single Stat Controls** to specify the following:
#### Line Graph + Single Stat example
![Line Graph + Single Stat example](/img/chronograf/chrono-viz-line-graph-single-stat-example.png)
![Line Graph + Single Stat example](/img/chrono-viz-line-graph-single-stat-example.png)
### Single Stat
The **Single Stat** view displays the most recent value of the specified time series as a numerical value.
![Single Stat view](/img/chronograf/chrono-viz-single-stat-selector.png)
![Single Stat view](/img/chrono-viz-single-stat-selector.png)
If a cell's query includes a [`GROUP BY` tag](/influxdb/latest/query_language/data_exploration/#group-by-tags) clause, Chronograf sorts the different [series](/influxdb/latest/concepts/glossary/#series) lexicographically and shows the most recent [field value](/influxdb/latest/concepts/glossary/#field-value) associated with the first series.
For example, if a query groups by the `name` [tag key](/influxdb/latest/concepts/glossary/#tag-key) and `name` has two [tag values](/influxdb/latest/concepts/glossary/#tag-value) (`chronelda` and `chronz`), Chronograf shows the most recent field value associated with the `chronelda` series.
@ -205,11 +210,11 @@ The **Gauge** view displays the single value most recent value for a time series
To select this view, click the Gauge selector icon.
![Gauge selector](/img/chronograf/chrono-viz-gauge-selector.png)
![Gauge selector](/img/chrono-viz-gauge-selector.png)
#### Gauge Controls
![Gauge Controls](/img/chronograf/chrono-viz-gauge-controls.png)
![Gauge Controls](/img/chrono-viz-gauge-controls.png)
Use the **Gauge Controls** to specify the following:
@ -223,17 +228,17 @@ Use the **Gauge Controls** to specify the following:
#### Gauge example
![Gauge example](/img/chronograf/chrono-viz-gauge-example.png)
![Gauge example](/img/chrono-viz-gauge-example.png)
### Table
The **Table** panel displays the results of queries in a tabular view, which is sometimes easier to analyze than graph views of data.
![Table selector](/img/chronograf/chrono-viz-table-selector.png)
![Table selector](/img/chrono-viz-table-selector.png)
#### Table Controls
![Table Controls](/img/chronograf/chrono-viz-table-controls.png)
![Table Controls](/img/chrono-viz-table-controls.png)
Use the **Table Controls** to specify the following:
@ -259,4 +264,4 @@ Threshold settings apply to any cells with values, except when they appear in th
#### Table view example
![Table example](/img/chronograf/chrono-viz-table-example.png)
![Table example](/img/chrono-viz-table-example.png)

Binary file not shown.

View File

@ -36,6 +36,8 @@
<glyph unicode="&#xe91a;" glyph-name="chevron-up" d="M797.867 328.534l-256 256c-17.067 17.067-42.667 17.067-59.733 0l-256-256c-17.067-17.067-17.067-42.667 0-59.733s42.667-17.067 59.733 0l226.133 226.133 226.133-226.133c8.533-8.533 21.333-12.8 29.867-12.8s21.333 4.267 29.867 12.8c17.067 17.067 17.067 42.667 0 59.733z" />
<glyph unicode="&#xe91b;" glyph-name="menu" d="M896 469.334h-768c-25.6 0-42.667-17.067-42.667-42.667s17.067-42.667 42.667-42.667h768c25.6 0 42.667 17.067 42.667 42.667s-17.067 42.667-42.667 42.667zM128 640h768c25.6 0 42.667 17.067 42.667 42.667s-17.067 42.667-42.667 42.667h-768c-25.6 0-42.667-17.067-42.667-42.667s17.067-42.667 42.667-42.667zM896 213.334h-768c-25.6 0-42.667-17.067-42.667-42.667s17.067-42.667 42.667-42.667h768c25.6 0 42.667 17.067 42.667 42.667s-17.067 42.667-42.667 42.667z" />
<glyph unicode="&#xe91c;" glyph-name="download" d="M896 341.334c-25.6 0-42.667-17.067-42.667-42.667v-170.667c0-25.6-17.067-42.667-42.667-42.667h-597.333c-25.6 0-42.667 17.067-42.667 42.667v170.667c0 25.6-17.067 42.667-42.667 42.667s-42.667-17.067-42.667-42.667v-170.667c0-72.533 55.467-128 128-128h597.333c72.533 0 128 55.467 128 128v170.667c0 25.6-17.067 42.667-42.667 42.667zM482.133 268.8c4.267-4.267 8.533-8.533 12.8-8.533 4.267-4.267 12.8-4.267 17.067-4.267s12.8 0 17.067 4.267c4.267 4.267 8.533 4.267 12.8 8.533l213.333 213.333c17.067 17.067 17.067 42.667 0 59.733s-42.667 17.067-59.733 0l-140.8-140.8v409.6c0 25.6-17.067 42.667-42.667 42.667s-42.667-17.067-42.667-42.667v-409.6l-140.8 140.8c-17.067 17.067-42.667 17.067-59.733 0s-17.067-42.667 0-59.733l213.333-213.333z" />
<glyph unicode="&#xe91d;" glyph-name="minus" d="M810.667 469.334h-597.333c-25.6 0-42.667-17.067-42.667-42.667s17.067-42.667 42.667-42.667h597.333c25.6 0 42.667 17.067 42.667 42.667s-17.067 42.667-42.667 42.667z" />
<glyph unicode="&#xe91e;" glyph-name="plus" d="M810.667 469.334h-256v256c0 25.6-17.067 42.667-42.667 42.667s-42.667-17.067-42.667-42.667v-256h-256c-25.6 0-42.667-17.067-42.667-42.667s17.067-42.667 42.667-42.667h256v-256c0-25.6 17.067-42.667 42.667-42.667s42.667 17.067 42.667 42.667v256h256c25.6 0 42.667 17.067 42.667 42.667s-17.067 42.667-42.667 42.667z" />
<glyph unicode="&#xe934;" glyph-name="folder-upload" d="M576 704l-128 128h-448v-832h1024v704h-448zM512 480l224-224h-160v-256h-128v256h-160l224 224z" />
<glyph unicode="&#xe94c;" glyph-name="map2" d="M672 768l-320 128-352-128v-768l352 128 320-128 352 128v768l-352-128zM384 814.27l256-102.4v-630.138l-256 102.398v630.14zM64 723.172l256 93.090v-631.8l-256-93.088v631.798zM960 172.828l-256-93.092v631.8l256 93.090v-631.798z" />
<glyph unicode="&#xe994;" glyph-name="cog" d="M933.79 349.75c-53.726 93.054-21.416 212.304 72.152 266.488l-100.626 174.292c-28.75-16.854-62.176-26.518-97.846-26.518-107.536 0-194.708 87.746-194.708 195.99h-201.258c0.266-33.41-8.074-67.282-25.958-98.252-53.724-93.056-173.156-124.702-266.862-70.758l-100.624-174.292c28.97-16.472 54.050-40.588 71.886-71.478 53.638-92.908 21.512-211.92-71.708-266.224l100.626-174.292c28.65 16.696 61.916 26.254 97.4 26.254 107.196 0 194.144-87.192 194.7-194.958h201.254c-0.086 33.074 8.272 66.57 25.966 97.218 53.636 92.906 172.776 124.594 266.414 71.012l100.626 174.29c-28.78 16.466-53.692 40.498-71.434 71.228zM512 240.668c-114.508 0-207.336 92.824-207.336 207.334 0 114.508 92.826 207.334 207.336 207.334 114.508 0 207.332-92.826 207.332-207.334-0.002-114.51-92.824-207.334-207.332-207.334z" />

Before

Width:  |  Height:  |  Size: 32 KiB

After

Width:  |  Height:  |  Size: 32 KiB

Binary file not shown.

Binary file not shown.

View File

@ -0,0 +1,71 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 23.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 300 100" style="enable-background:new 0 0 300 100;" xml:space="preserve">
<style type="text/css">
.st0{fill:#42434C;}
.st1{fill:#9295A0;}
</style>
<g>
<rect x="-1" y="-1" class="st0" width="302" height="102"/>
</g>
<g>
<path class="st1" d="M94.81,43.41h1.18l-1.64,9.33h-1.18L94.81,43.41z"/>
<path class="st1" d="M105.85,47.48c0.01-0.08,0.03-0.18,0.03-0.24c0-0.28-0.14-0.38-0.48-0.38c-0.69,0-1.82,0.53-2.56,1.02
l-0.85,4.85h-1.15l0.92-5.25c0.01-0.08,0.03-0.18,0.03-0.24c0-0.28-0.14-0.38-0.48-0.38c-0.69,0-1.74,0.5-2.58,1.02l-0.85,4.85
h-1.15L97.92,46l1.01-0.17l-0.08,0.97c0.67-0.48,2.07-1.02,2.89-1.02c0.77,0,1.15,0.39,1.2,1.02c0.74-0.52,2.07-1.02,2.89-1.02
c0.85,0,1.22,0.46,1.22,1.2c0,0.15-0.01,0.36-0.06,0.59l-0.91,5.17h-1.15L105.85,47.48z"/>
<path class="st1" d="M113.18,52.74h-0.95l0.04-0.83c-0.76,0.67-1.68,0.97-2.55,0.97c-1.05,0-1.44-0.57-1.44-1.36
c0-0.17,0.03-0.35,0.06-0.53l0.48-2.7c0.29-1.65,0.91-2.51,3.07-2.51c0.84,0,1.78,0.21,2.45,0.46L113.18,52.74z M113.06,46.94
c-0.36-0.1-0.84-0.17-1.32-0.17c-1.05,0-1.57,0.32-1.81,1.67l-0.43,2.47c-0.03,0.17-0.06,0.35-0.06,0.48c0,0.32,0.14,0.5,0.56,0.5
c0.85,0,1.61-0.48,2.4-1.19L113.06,46.94z"/>
<path class="st1" d="M120.24,53.77c-0.25,1.43-0.83,1.86-2.4,1.86c-0.9,0-2.1-0.28-2.8-0.57l0.24-0.87
c0.94,0.34,1.81,0.49,2.61,0.49c0.87,0,1.09-0.27,1.22-1l0.35-1.98c-0.76,0.6-1.64,0.88-2.51,0.88c-1.05,0-1.44-0.57-1.44-1.36
c0-0.17,0.03-0.35,0.06-0.53l0.43-2.4c0.29-1.65,0.97-2.54,3.12-2.54c0.66,0,1.71,0.18,2.44,0.49L120.24,53.77z M120.3,46.95
c-0.36-0.1-0.9-0.18-1.37-0.18c-1.13,0-1.57,0.35-1.81,1.69l-0.39,2.19c-0.03,0.17-0.06,0.32-0.06,0.45c0,0.32,0.14,0.5,0.56,0.5
c0.73,0,1.71-0.49,2.44-1.11L120.3,46.95z"/>
<path class="st1" d="M123.92,50.92c-0.03,0.15-0.03,0.25-0.03,0.31c0,0.43,0.21,0.69,0.94,0.69c0.71,0,1.57-0.27,2.49-0.71
l0.25,0.85c-0.87,0.48-1.76,0.83-2.9,0.83c-1.37,0-1.92-0.64-1.92-1.58c0-0.17,0.01-0.39,0.06-0.63l0.41-2.3
c0.31-1.72,1.08-2.59,3.01-2.59c1.13,0,1.95,0.53,1.95,1.54c0,1.15-0.53,1.72-2.45,2.37c-0.83,0.28-1.09,0.35-1.68,0.53
L123.92,50.92z M127.1,47.44c0-0.45-0.34-0.73-0.95-0.73c-1.06,0-1.55,0.39-1.75,1.5l-0.17,0.94c0.38-0.11,0.6-0.18,1.26-0.38
C126.62,48.44,127.1,48,127.1,47.44z"/>
<path class="st1" d="M132.28,50.72c0-0.21,0.03-0.43,0.07-0.69l0.71-4.05c0.35-1.95,1.36-2.72,3.61-2.72c0.71,0,1.61,0.1,2.33,0.29
l-0.24,1.01c-0.71-0.15-1.57-0.25-2.19-0.25c-1.53,0-2.12,0.42-2.37,1.82l-0.69,3.91c-0.04,0.22-0.06,0.42-0.06,0.59
c0,0.84,0.46,1.19,1.79,1.19c0.62,0,1.48-0.08,2.23-0.22l0.04,1.01c-0.73,0.15-1.72,0.27-2.51,0.27
C133.05,52.88,132.28,52.01,132.28,50.72z"/>
<path class="st1" d="M139.32,50.29l0.35-1.99c0.29-1.67,1.25-2.52,3.21-2.52c1.57,0,2.38,0.87,2.38,2.03c0,0.1,0,0.25-0.04,0.48
l-0.38,2.14c-0.27,1.54-1.08,2.45-3.19,2.45C139.7,52.88,139.05,51.76,139.32,50.29z M144.07,48.28c0.03-0.15,0.04-0.29,0.04-0.41
c0-0.74-0.43-1.11-1.4-1.11c-1.12,0-1.71,0.53-1.89,1.6l-0.35,1.97c-0.15,0.94,0.07,1.54,1.34,1.54c1.18,0,1.71-0.5,1.89-1.53
L144.07,48.28z"/>
<path class="st1" d="M155.44,47.48c0.01-0.08,0.03-0.18,0.03-0.24c0-0.28-0.14-0.38-0.48-0.38c-0.69,0-1.82,0.53-2.56,1.02
l-0.85,4.85h-1.15l0.93-5.25c0.01-0.08,0.03-0.18,0.03-0.24c0-0.28-0.14-0.38-0.48-0.38c-0.69,0-1.74,0.5-2.58,1.02l-0.85,4.85
h-1.15l1.19-6.74l1.01-0.17l-0.08,0.97c0.67-0.48,2.07-1.02,2.88-1.02c0.77,0,1.15,0.39,1.21,1.02c0.74-0.52,2.07-1.02,2.89-1.02
c0.85,0,1.22,0.46,1.22,1.2c0,0.15-0.01,0.36-0.06,0.59l-0.91,5.17h-1.15L155.44,47.48z"/>
<path class="st1" d="M159.02,46l1.18-0.17l-1.22,6.91h-1.15L159.02,46z M159.52,43.13l1.18-0.17l-0.31,1.75l-1.18,0.15
L159.52,43.13z"/>
<path class="st1" d="M167.43,46.98c0,0.15-0.01,0.36-0.06,0.59l-0.91,5.17h-1.15l0.92-5.25c0.01-0.08,0.03-0.18,0.03-0.24
c0-0.28-0.14-0.38-0.48-0.38c-0.69,0-1.74,0.5-2.58,1.02l-0.85,4.85h-1.15L162.4,46l1.01-0.17l-0.09,0.97
c0.67-0.48,2.07-1.02,2.89-1.02C167.07,45.78,167.43,46.24,167.43,46.98z"/>
<path class="st1" d="M173.45,53.77c-0.25,1.43-0.83,1.86-2.39,1.86c-0.9,0-2.1-0.28-2.8-0.57l0.24-0.87
c0.94,0.34,1.81,0.49,2.61,0.49c0.87,0,1.09-0.27,1.22-1l0.35-1.98c-0.76,0.6-1.64,0.88-2.51,0.88c-1.05,0-1.44-0.57-1.44-1.36
c0-0.17,0.03-0.35,0.05-0.53l0.44-2.4c0.29-1.65,0.97-2.54,3.12-2.54c0.66,0,1.71,0.18,2.44,0.49L173.45,53.77z M173.51,46.95
c-0.37-0.1-0.9-0.18-1.37-0.18c-1.13,0-1.57,0.35-1.81,1.69l-0.39,2.19c-0.03,0.17-0.06,0.32-0.06,0.45c0,0.32,0.14,0.5,0.56,0.5
c0.73,0,1.71-0.49,2.44-1.11L173.51,46.95z"/>
<path class="st1" d="M178.71,52.36l0.27-0.94c0.87,0.27,1.72,0.43,2.52,0.43c1.5,0,1.89-0.41,2.09-1.53
c0.05-0.31,0.1-0.55,0.1-0.73c0-0.59-0.37-0.74-1.72-1.09c-1.62-0.42-2.12-0.94-2.12-1.92c0-0.28,0.04-0.59,0.1-0.94
c0.34-1.89,1.09-2.38,3.32-2.38c0.7,0,1.72,0.13,2.45,0.32l-0.21,0.99c-0.79-0.18-1.74-0.28-2.31-0.28c-1.58,0-1.88,0.25-2.07,1.37
c-0.05,0.32-0.1,0.6-0.1,0.77c0,0.59,0.35,0.76,1.64,1.11c1.72,0.46,2.21,0.91,2.21,1.83c0,0.24-0.04,0.59-0.11,0.95
c-0.29,1.69-0.84,2.54-3.38,2.54C180.59,52.88,179.5,52.68,178.71,52.36z"/>
<path class="st1" d="M186.44,50.29l0.35-1.99c0.29-1.67,1.25-2.52,3.21-2.52c1.57,0,2.38,0.87,2.38,2.03c0,0.1,0,0.25-0.04,0.48
l-0.38,2.14c-0.27,1.54-1.08,2.45-3.19,2.45C186.82,52.88,186.18,51.76,186.44,50.29z M191.19,48.28c0.03-0.15,0.04-0.29,0.04-0.41
c0-0.74-0.43-1.11-1.4-1.11c-1.12,0-1.71,0.53-1.89,1.6l-0.35,1.97c-0.15,0.94,0.07,1.54,1.35,1.54c1.18,0,1.71-0.5,1.89-1.53
L191.19,48.28z"/>
<path class="st1" d="M193.53,50.29l0.35-1.99c0.29-1.67,1.25-2.52,3.21-2.52c1.57,0,2.38,0.87,2.38,2.03c0,0.1,0,0.25-0.04,0.48
l-0.38,2.14c-0.27,1.54-1.08,2.45-3.19,2.45C193.9,52.88,193.26,51.76,193.53,50.29z M198.28,48.28c0.03-0.15,0.04-0.29,0.04-0.41
c0-0.74-0.43-1.11-1.4-1.11c-1.12,0-1.71,0.53-1.89,1.6l-0.35,1.97c-0.15,0.94,0.07,1.54,1.35,1.54c1.18,0,1.71-0.5,1.89-1.53
L198.28,48.28z"/>
<path class="st1" d="M206.75,46.98c0,0.15-0.02,0.36-0.06,0.59l-0.91,5.17h-1.15l0.92-5.25c0.01-0.08,0.03-0.18,0.03-0.24
c0-0.28-0.14-0.38-0.48-0.38c-0.69,0-1.74,0.5-2.58,1.02l-0.86,4.85h-1.15l1.19-6.74l1.01-0.17l-0.08,0.97
c0.67-0.48,2.07-1.02,2.89-1.02C206.38,45.78,206.75,46.24,206.75,46.98z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 6.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 169 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 232 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 27 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 28 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 58 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 90 KiB