gifts2017

Красивые и полнофункциональные диаграммы AmCharts в 1С на основе HTML и JavaScript, полностью offline, все виды, версия 3.2.0

Опубликовал Роман Цованян (pfihr) в раздел Программирование - Работа с интерфейсом

Полноценная обработка, содержащая оффлайн версию JavaScript графиков AmCharts версии 3.2.0. С обработкой нажатия мыши.
Все виды графиков: Column, Bar, Line, Area, Step, Smoothed line, Candlestick, Pie/Donut, Radar/Polar, XY/Scatter/Bubble, Bullet, Funnel/Pyramid.

Полноценная обработка, содержащая оффлайн версию JavaScript графиков AmCharts версии 3.2.0.

Реализованы все объекты из http://www.amcharts.com/javascript-charts/.

Обрабатывается нажатие мыши на точку/ребро графика. Пример обработки нажатия смотрите на графике "глубина/день".

Работают все виды графиков: Column, Bar, Line, Area, Step, Smoothed line, Candlestick, Pie/Donut, Radar/Polar, XY/Scatter/Bubble, Bullet, Funnel/Pyramid. 

Использовать не просто, а очень просто. Мой ответ доминикане и tushich.

Пример использования (из текста обработки):

Функция ЗаполнитьHTML(тз,об,вар)
  // RADAR CHART
   амОснова = AmChartsПолучитьОснову("AmRadarChart",AmChartsВременныйКаталогКартинок());
   амОснова.Параметры["startDuration"] = 2;
   амОснова.Параметры["categoryField"] = "country";
 
   // VALUE AXIS
   амОбъект = AmChartsСоздатьОбъект("valueAxis","ValueAxis","");
   амОбъект.Параметры.position = "bottom";
   амОбъект.Параметры.axisAlpha = 0.15;
   амОбъект.Параметры.dashLength = 3;
   амОбъект.Параметры.axisTitleOffset = 20;
   амОбъект.Параметры.gridCount = 5;
   амОснова.Объекты.Добавить(амОбъект);
 
   // GRAPH
   амОбъект = AmChartsСоздатьОбъект("graph","AmGraph","");
   амОбъект.Параметры.valueField = "litres";
   амОбъект.Параметры.bullet = "round";
   амОбъект.Параметры.balloonText = "[[value]] litres of beer per year";
   амОснова.Объекты.Добавить(амОбъект);
   амОснова.ТелоФункции = AmChartsПолучитьТелоФункции(амОснова);
   амОснова.Данные = AmChartsДанные(тз);
   
  Возврат AmChartsПолучитьHTMLТекст(амОснова,об);
КонецФункции

Вот что получается:

Скачать файлы

Наименование Файл Версия Размер
amCharts3.2.0.epf 147
.epf 125,59Kb
11.11.13
147
.epf 3.2.0+ 125,59Kb Скачать

См. также

Подписаться Добавить вознаграждение

Комментарии

1. script Мальчинко (script) 01.11.13 23:46
Поддерживается ли Диаграмма Ганта ?
2. Яков Коган (Yashazz) 05.11.13 12:49
Немного не понял, что потребуется для работы? AmChartsПолучитьОснову - это что за зверь и где объявлен?
Взлетит ли на УФ?
3. Фёдор (Tedman) 05.11.13 15:21
(2) Yashazz,
На сколько мне известна данная тематика (а я в данный момент чем-то вроде этого же занимаюсь), то:
Немного не понял, что потребуется для работы?


AmChartsПолучитьОснову - это что за зверь и где объявлен?

Как я понимаю, это структура с необходимыми настройками для вывода диаграмм. Объявлен где-то глубже, а вот где и как автор в статье описывать не стал.
Взлетит ли на УФ?

На них, родимых, судя по скринам, в основном, и летает.
4. Алекс Климанов (fuxic) 05.11.13 16:59
(1) ради функционала-аналога диаграмм Ганта стал разбираться с амЧартом. В принципе механизм вполне заложен в библиотеке, но на примерах сайта построить сходу не получилось.

Буду рад если реализуете аналог Ганта на амчарте. Исправить floating bar на работу с датами и это уже заработает. Надо только будет шкалу и фильтры под конкретную задачу.
5. Алекс Климанов (fuxic) 05.11.13 17:00
Не совсем понял то, что убрана ссылка на сайт библиотеки. Это вроде прямое нарушение бесплатной лицензии.
6. Alex (AlexBugs) 06.11.13 07:45
А на 7.7. такое взлетит? А то очень хочется....
8. DAnry (DAnry) 06.11.13 14:18
9. Ринат Исхаков (randa) 06.11.13 15:33
10. kiruha Дронов (kiruha) 06.11.13 16:27
Наконец то нормальные диаграммы
11. Роман Цованян (pfihr) 06.11.13 23:58
(4) fuxic, попробую реализовать. Сначала надо потренироваться в консоли jsfiddle, затем это легко переносится в мою обработку.
Прикрепленные файлы:
12. Роман Цованян (pfihr) 06.11.13 23:59
(2) Yashazz, взлетит. Кроме того, взлетит и на вэб-клиенте, и на мобильных устройствах.
13. Роман Цованян (pfihr) 06.11.13 23:59
(5) fuxic, Вы всегда можете вернуть ее в сам чарт, а я оставил ее в заголовке формы.
14. Роман Цованян (pfihr) 07.11.13 00:00
(1) script, только в варианте floating serial chart. См. скриншоты.
15. Сергей Кудашкин (sikuda) 07.11.13 13:40
Наконец-то хоть движения есть в графиках. А то как-то одиноко.
За старания безусловный +,
Чистота лицензий это святое (на сайте http://www.amcharts.com):
Q: Can I use amCharts for free?
A: Yes, the only limitation of the free version is that a small link to this web site will be displayed in the top left corner of your charts.
Что-то у тебя в верхнем левом угле ничего нет.

16. tixis1c tixis1c (qwed557) 07.11.13 22:45
(15) sikuda, есть же, или раньше не было а уже добавили, по крайней мере я на всех скринах вижу
17. Сергей Кудашкин (sikuda) 08.11.13 09:34
(16) qwed557,
Да вижу, что-то вчера глюкнуло.

Вопрос автору: Разобрались ли Вы в тонком клиенте Windows, что бы нажатие мышки правильно определяло объект. Если объект не прямоугольный? Pie например.
18. Роман Бедрицкий (movel) 08.11.13 11:31
Скажите, а как, например, с помощью этой библиотеки организовать вывод если количество переменных изменяется? Т.е. выбираешь сколько графиков будет отображаться - 1 или 2, например? Формировать разные наборы вызова?
19. Роман Цованян (pfihr) 10.11.13 11:11
(15) sikuda, я вынес ссылку на форму. В самом html поле эта ссылка часто затирала полезные данные. Это забавно, и даже видно на примере микро-чартов на сайте авторов библиотеки (откройте пример в jsfiddle) :)
20. Роман Цованян (pfihr) 10.11.13 11:12
(17) sikuda, пока не разбирался, не было необходимости. На Pie диаграмме нажатие мышью отодвигает сегмент от остальных сегментов, это встроенный функционал.
21. Роман Цованян (pfihr) 10.11.13 11:13
(18) movel, можно отображать любое количество графиков. Сколько объектов типа AmGraph добавите, столько их и будет. Разные наборы вызова я делаю так: создается одна таблица значений со всеми колонками для всех диаграмм. Дальше, заполняются данные, последовательно добавляются строки. Значения устанавливаются только для тех колонок, которые нужны для определенного графика (объекта AmGraph). В нужном объекте AmGraph указываются только эти колонки. Для следующего графика в т.з. добавляются новые строки, и заполняются данные других колонок таблицы значений, и для объекта AmGraph они указываются как источник. Смотрите пример на графике глубина-день, я там использовал 13 различных графиков в одной таблице значений. Библиотека умная, и строки/колонки с незаполненными значениями не учитывает при построении.
22. Роман Цованян (pfihr) 11.11.13 07:58
Если Вы встретились с проблемами масштабирования курсором, исправьте в коде макета следующие функции:

b.prototype.listenTo = function(a, b, c) {
var d = a.events[b], e = !1, g = 0;
for (h = d.length;g < h;g++) {
d[g].handler == c && d[g].scope == this && (e = !0);
}
return e ? d.length : d.push({handler:c, scope:this});
}, b.prototype.addListener = function(a, b, c) {
var d = this.events[a], e = !1, g = 0;
for (h = d.length;g < h;g++) {
d[g].handler == b && d[g].scope == c && (e = !0);
}
return e ? d.length : d.push({handler:b, scope:c});
}
sergcool83; +1 Ответить
23. Роман Цованян (pfihr) 11.11.13 09:31
В новой версии 3.2.0 ошибка зума исправлена (мной). Разработчики пока не исправили.
Так же много новых изменений, упрощена процедура программирования.
24. Валерий Дегрик (mars207) 28.01.14 18:37
Очень полезная обработка. Плюс обязательно добавлю. Но есть вопрос. А можно ли сформировать диаграмму такого типа как указано во вложении к комментарию? Тип диаграммы очень похож на "3D stacked column chart", но я бы хотел расширить его возможности. Чтобы это было похоже на более изощренную сводную диаграмму. Excell такое умеет...
Прикрепленные файлы:
25. Валерий Дегрик (mars207) 28.01.14 18:39
26. Роман Цованян (pfihr) 31.01.14 21:35
27. Alex Kles (KlesAlex) 24.03.15 17:38
Сколько мануал не курил а так и не понял как нижнюю ось сделать не числовую а в виде дат
чтобы рисовать диаграмму ганта.
Все тлен(
28. 5150 (5150) 07.04.15 13:54
Доброго! а возможность экспорта в *.jpg или вывода на печать есть? даже из их онлайн конструктора интереса ради копировал html код, в котором кнопка (экспорта) есть, а в самой 1с-ке ее нет.
29. Игорь Богданов (avz_1C) 29.04.15 18:55
Спасибо, Автор!
Чрезвычайно полезная вещь!
Плюс поставил.
Жалею, нельзя два-три за раз поставить.
30. advanter Адвантер (advanter) 19.02.16 22:36
Отличные графики.
Чрезвычайно просто в применении и достойно в использовании. Плюсик, однозначно.
31. Роман Цованян (pfihr) 05.03.16 14:19
Спасибо коллеги!
Заказывайте что нибудь этакое, сделаю.
Рекомендую посмотреть ролик на тему отображения заказа покупателя на Яндекс.Картах.
Ролик на Youtube
Роман Цованян
Для написания сообщения необходимо авторизоваться
Прикрепить файл
Дополнительные параметры ответа