Линии Диаграммы - Оси Маркера / Графики / Сниппеты Bootstrap | BootstrapТема

1
2
3
4
5

Версия: v1.0

Каталог: Сниппеты Bootstrap

Категория: Графики

Для Bootstrap: 3, 4, 5

Для CMS: HTML, Drupal, Joomla, uCoz, WordPress, Magento, OpenCart, PrestaShop

Язык: Английский

Вес файла: 524.0 Kb

Уникальный ID: 1176

Количество символов:

Посмотрели: 3951 раз

Помощь: установка & настройка

Прикреплён файл №1: /_sf/11/1176.css

Прикреплён файл №2: /stuff/0-0-0-1176-20

Скачали бесплатно: 127 раз

Прокомментировали: 0 раз

Рейтинг: 3.4 / 5 - 5 голосов

Тип лицензии: CC BY 4.0

Авторство: https://goo.gl/1JxVqF

Информация: Пользователям

Информация: Правообладателям

Теги: Chart, Snippet, диаграммы, html, графики, сниппет, Bootstrap

Поделился: BootstrapТема

Добавлено: 2016-07-14 в 10:10

Метка: 1581115961

⇄ ⇅

<link rel="stylesheet" href="https://bootstraptema.ru/plugins/2015/bootstrap3/bootstrap.min.css" />
<link type="text/css" rel="StyleSheet" href="https://bootstraptema.ru/plugins/2016/shieldui/style.css" />
<script src="https://bootstraptema.ru/plugins/jquery/jquery-1.11.3.min.js"></script>
<script src="https://bootstraptema.ru/plugins/2016/shieldui/script.js"></script>

<br><br><br>

<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">

<div id="chart">

<script>
 $(document).ready(function () {
 $("#chart").shieldChart({
 theme: "light",
 primaryHeader: {
 text: "Обзор бюджета"
 },
 exportOptions: {
 image: false,
 print: false
 },
 axisX: {
 categoricalValues: ["2000", "2001", "2002", "2003", "2004", "2005", "2006", "2007", "2008", "2009", "2010", "2011", "2012", "2013", "2014"]
 },
 tooltipSettings: {
 chartBound: true,
 axisMarkers: {
 enabled: true,
 mode: 'xy'
 } 
 },
 dataSeries: [{
 seriesType: 'line',
 collectionAlias: "Бюджет в тысячях",
 data: [100, 320, 453, 234, 553, 665, 345, 123, 432, 545, 654, 345, 332, 456, 234]
 }]
 });
 });
 </script>

</div>
</div>
</div>