Форум программистов, компьютерный форум, киберфорум
JavaScript
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.67/3: Рейтинг темы: голосов - 3, средняя оценка - 4.67
1 / 1 / 0
Регистрация: 17.09.2015
Сообщений: 67

Ошибка при создании диаграмммы

23.10.2019, 12:52. Показов 636. Ответов 1

Студворк — интернет-сервис помощи студентам
Доброго всем дня!
Прошу помочь мне в решении следующего вопроса.
Должна получиться следующая картина:

Весь код(как я полагаю) у меня есть:
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<div class="box-body">
                    <div class="row">
                        <div class="col-md-8">
                            <div class="chart-responsive">
                                <canvas id="pieChart" height="166" width="692" style="width: 692px; height: 166px;"></canvas>
                            </div>
                            <!-- ./chart-responsive -->
                        </div>
                        <!-- /.col -->
                        <div class="col-md-4">
                            <ul class="chart-legend clearfix">
                                                                    <li><i class="fa fa-circle-o text-red"></i> 10.0_0_17763_x64(44)</li>
                                                                    <li><i class="fa fa-circle-o text-red"></i> Windows 7(129)</li>
                                                                    <li><i class="fa fa-circle-o text-red"></i> 10.0_0_18362_x64(88)</li>
                                                                    <li><i class="fa fa-circle-o text-red"></i> 10.0_0_17134_x64(28)</li>
                                                                    <li><i class="fa fa-circle-o text-red"></i> Windows 8.1, Update 1(1)</li>
                                                                    <li><i class="fa fa-circle-o text-red"></i> Update(2)</li>
                                                                    <li><i class="fa fa-circle-o text-red"></i> 10.0_0_16299_x64(1)</li>
                                                                    <li><i class="fa fa-circle-o text-red"></i> Anniversary Update(1)</li>
                                                                    <li><i class="fa fa-circle-o text-red"></i> 10.0_0_17134_x86(1)</li>
                                                            </ul>
                        </div>
                        <!-- /.col -->
                    </div>
                    <!-- /.row -->
                </div>
JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
var pieChartCanvas = $('#pieChart').get(0).getContext('2d');
    var pieChart       = new Chart(pieChartCanvas);
    var PieData        = [
                    {
                value    : 44,
                color    : "#08a6b1",
                highlight: "#a1c96f",
                label    : '10.0_0_17763_x64'
            },
                    {
                value    : 129,
                color    : "#908adf",
                highlight: "#cc804c",
                label    : 'Windows 7'
            },
                    {
                value    : 88,
                color    : "#0c7b25",
                highlight: "#9471e8",
                label    : '10.0_0_18362_x64'
            },
                    {
                value    : 28,
                color    : "#e00571",
                highlight: "#723a99",
                label    : '10.0_0_17134_x64'
            },
                    {
                value    : 1,
                color    : "#50faea",
                highlight: "#7ae471",
                label    : 'Windows 8.1, Update 1'
            },
                    {
                value    : 2,
                color    : "#c584af",
                highlight: "#e94dda",
                label    : 'Update'
            },
                    {
                value    : 1,
                color    : "#506643",
                highlight: "#8cd981",
                label    : '10.0_0_16299_x64'
            },
                    {
                value    : 1,
                color    : "#64e08a",
                highlight: "#6cbae4",
                label    : 'Anniversary Update'
            },
                    {
                value    : 1,
                color    : "#09111c",
                highlight: "#afc938",
                label    : '10.0_0_17134_x86'
            },
            ];
    var pieOptions     = {
        // Boolean - Whether we should show a stroke on each segment
        segmentShowStroke    : true,
        // String - The colour of each segment stroke
        segmentStrokeColor   : '#fff',
        // Number - The width of each segment stroke
        segmentStrokeWidth   : 1,
        // Number - The percentage of the chart that we cut out of the middle
        percentageInnerCutout: 50, // This is 0 for Pie charts
        // Number - Amount of animation steps
        animationSteps       : 100,
        // String - Animation easing effect
        animationEasing      : 'easeOutBounce',
        // Boolean - Whether we animate the rotation of the Doughnut
        animateRotate        : true,
        // Boolean - Whether we animate scaling the Doughnut from the centre
        animateScale         : false,
        // Boolean - whether to make the chart responsive to window resizing
        responsive           : true,
        // Boolean - whether to maintain the starting aspect ratio or not when responsive, if set to false, will take up entire container
        maintainAspectRatio  : false,
        // String - A legend template
        legendTemplate       : '<ul class=\'<%=name.toLowerCase()%>-legend\'><% for (var i=0; i<segments.length; i++){%><li><span style=\'background-color:<%=segments[i].fillColor%>\'></span><%if(segments[i].label){%><%=segments[i].label%><%}%></li><%}%></ul>',
        // String - A tooltip template
        tooltipTemplate      : '<%=value %> <%=label%> users'
    };
    // Create pie or douhnut chart
    // You can switch between pie and douhnut using the method below.
    pieChart.Doughnut(PieData, pieOptions);
После запуска через webpack, у меня выходит ошибка на весь экран браузера и весь предыдущий код просто исчезает. Пожалуйста, помогите понять, в чём дело
Code
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
Html Webpack Plugin:
  ReferenceError: name is not defined
  
  - loader.js:16 eval
    [index.html?.]/[html-webpack-plugin]/lib/loader.js:16:11
  
  - loader.js:34 module.exports
    [index.html?.]/[html-webpack-plugin]/lib/loader.js:34:3
  
  - index.js:284 Promise.resolve.then
    [Webpack-Bootstrap22222]/[html-webpack-plugin]/index.js:284:18
  
  
  - next_tick.js:188 process._tickCallback
    internal/process/next_tick.js:188:7
0
IT_Exp
Эксперт
34794 / 4073 / 2104
Регистрация: 17.06.2006
Сообщений: 32,602
Блог
23.10.2019, 12:52
Ответы с готовыми решениями:

WebSocket. Ошибка при создании подключения
Здравствуйте! У меня есть веб приложение - video chat. Работает при помощи WebSockets. Сразу скажу не я писал, скачал отсюда...

Ошибка 0x800a138f в Visual Studio при создании скрипта JS
Всем привет. Вешаю обработчик события &quot;click&quot; (для учебных целей) на JS в Visual Studio, выдает ошибку: &quot;0x800a138f - Ошибка...

Ошибка при создании контекстного меню JQuery
Здравствуйте, решил попробовать код создания контекстного меню из примера. Создал файл со скриптом, загрузил библиотеки: ...

1
1786 / 1036 / 445
Регистрация: 12.05.2016
Сообщений: 2,550
24.10.2019, 09:42
Алексей-87, ошибка в конфигурации вебпака, ссылку на проект скиньте.
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
BasicMan
Эксперт
29316 / 5623 / 2384
Регистрация: 17.02.2009
Сообщений: 30,364
Блог
24.10.2019, 09:42
Помогаю со студенческими работами здесь

Ошибка при создании дескриптора окна при динамическом создании кнопок
public Form1() { InitializeComponent(); } int height = 10; int width = 10; ...

При создании класса в проекте, после сборки появляется ошибка Ошибка HTTP 403.14 - Forbidden.
Сайт только начинаю делать. БД подключена, данные выводятся. При создании класса в проекте, после сборки появляется ошибка Ошибка HTTP...

Ошибка при создании объекта. (При изменении цвета заполнения фигуры)
Дано: Adobe Flash CS3 Prof. Требуется программно изменить цвет заполнения нарисованной фигуры, преобразованной в символ. При помощи...

Ошибка при импорте элементов при создании П/П в Altuim Designer 14
Помогите разобраться в Altuim designer 14 с ошибками при импорте элементов из схемы в ПП: unknown pin и failed to add class member. ...

При подключении DLL: Ошибка при создании объекта из компоненты
Создана DLL. При попытке подключения из 1С получаем сообщение: Ошибка при создании объекта из компоненты c:Program FilesMicrosoft...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
2
Ответ Создать тему
Новые блоги и статьи
SDL3 для Web (WebAssembly): Вывод текста со шрифтом TTF с помощью SDL3_ttf
8Observer8 01.02.2026
Содержание блога В этой пошаговой инструкции создадим с нуля веб-приложение, которое выводит текст в окне браузера. Запустим на Android на локальном сервере. Загрузим Release на бесплатный. . .
SDL3 для Web (WebAssembly): Сборка C/C++ проекта из консоли
8Observer8 30.01.2026
Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .
SDL3 для Web (WebAssembly): Установка Emscripten SDK (emsdk) и CMake для сборки C и C++ приложений в Wasm
8Observer8 30.01.2026
Содержание блога Для того чтобы скачать Emscripten SDK (emsdk) необходимо сначало скачать и уставить Git: Install for Windows. Следуйте стандартной процедуре установки Git через установщик. . . .
SDL3 для Android: Подключение Box2D v3, физика и отрисовка коллайдеров
8Observer8 29.01.2026
Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами. Версия v3 была полностью переписана на Си, в. . .
Инструменты COM: Сохранение данный из VARIANT в файл и загрузка из файла в VARIANT
bedvit 28.01.2026
Сохранение базовых типов COM и массивов (одномерных или двухмерных) любой вложенности (деревья) в файл, с возможностью выбора алгоритмов сжатия и шифрования. Часть библиотеки BedvitCOM Использованы. . .
SDL3 для Android: Загрузка PNG с альфа-каналом с помощью SDL_LoadPNG (без SDL3_image)
8Observer8 28.01.2026
Содержание блога SDL3 имеет собственные средства для загрузки и отображения PNG-файлов с альфа-каналом и базовой работы с ними. В этой инструкции используется функция SDL_LoadPNG(), которая. . .
SDL3 для Android: Загрузка PNG с альфа-каналом с помощью SDL3_image
8Observer8 27.01.2026
Содержание блога SDL3_image - это библиотека для загрузки и работы с изображениями. Эта пошаговая инструкция покажет, как загрузить и вывести на экран смартфона картинку с альфа-каналом, то есть с. . .
Влияние грибов на сукцессию
anaschu 26.01.2026
Бифуркационные изменения массы гриба происходят тогда, когда мы уменьшаем массу компоста в 10 раз, а скорость прироста биомассы уменьшаем в три раза. Скорость прироста биомассы может уменьшаться за. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru