AAInfographics — это версия Kotlin популярного открытого фреймворка для создания графиков и диаграмм. Он основан на объектно-ориентированном подходе и представляет собой простой в использовании и очень красивый инструмент для разработки графиков. Возможно, это самый изысканный сторонний Android-фреймворк с открытым исходным кодом для построения диаграмм (✟ клянусь атеизмом, что я не несу чушь ✟).
<com.aachartmodel.aainfographics.AAInfographicsLib.AAChartConfiger.AAChartView
android:id="@+id/AAChartView"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
aaChartView = findViewById(R.id.AAChartView)
val aaChartModel = AAChartModel()
.chartType(AAChartType.Area)
.title("title")
.subtitle("subtitle")
.backgroundColor("#4b2b7f")
.dataLabelEnabled(true)
.yAxisGridLineWidth(0)
.legendVerticalAlign(AAChartLegendVerticalAlignType.Bottom)
.series(arrayOf(
AASeriesElement()
.name("Tokyo")
.data(arrayOf(7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6)),
AASeriesElement()
.name("NewYork")
.data(arrayOf(0.2, 0.8, 5.7, 11.3, 17.0, 22.0, 24.8, 24.1, 20.1, 14.1, 8.6, 2.5)),
AASeriesElement()
.name("London")
.data(arrayOf(0.9, 0.6, 3.5, 8.4, 13.5, 17.0, 18.6, 17.9, 14.3, 9.0, 3.9, 1.0)),
AASeriesElement()
.name("Berlin")
.data(arrayOf(3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8))
))
/*Представление диаграммы вызывает модель диаграммы, рисует окончательный график*/
aaChartView.aa_drawChartWithChartModel(aaChartModel);
🌹 🌹 🌹 Хорошо, теперь у вас есть все необходимое для построения графика! Вы получите желаемый график!
Если вам нужно обновить содержимое графика, прочитайте следующий контент и выберите функцию, которая соответствует вашим потребностям.
/*Обновлены только данные таблицы графиков, без изменения других свойств графиков*/
aaChartView.aa_onlyRefreshTheChartDataWithChartModelSeries(chartModelSeriesArray)
/*Обновление всего содержимого AAChartModel (например, изменение типа диаграммы с column chart на area chart), а затем обновление диаграммы*/
aaChartView.aa_refreshChartWholeContentWithChartModel(aaChartModel)
line chart (https://github.com/AAChartModel/loadHtmlCssJsDemo-master/blob/master/AAInfographics/LineChart.png) ### Столбчатая диаграмма — 條形圖
Дополнительные графические эффекты
Обратите внимание: приведённое ниже демонстрационное изображение представляет собой анимированный GIF-файл размером около 6 Мбайт. Если анимация не отображается, это означает, что ресурсы изображения загружены не полностью. После полной загрузки ресурсов изображения вы сможете увидеть динамические эффекты для дополнительных элементов.
Можно реализовать отслеживание событий касания пользователя и одиночное перетаскивание, установив методы прокси для экземпляра объекта AAChartView.
interface AAChartViewCallBack {
fun chartViewMoveOverEventMessage(aaChartView: AAChartView, messageModel: AAMoveOverEventMessageModel)
}
При отслеживании событий взаимодействия с пользователем информация о событии AAMoveOverEventMessageModel
содержит следующее содержимое:
class AAMoveOverEventMessageModel {
var name: String? = null
var x: Double? = null
var y: Double? = null
var category: String? = null
var offset: LinkedTreeMap<*, *>? = null
var index: Double? = null
}
AATooltip
через JavaScriptИногда встроенных эффектов всплывающих подсказок может быть недостаточно для удовлетворения особых требований пользователей. В этом случае можно добавить HTML-контент в текстовые свойства headerFormat
, footerFormat
и pointFormat
строки, чтобы определить содержимое всплывающей подсказки. Эти три свойства могут удовлетворить большинство потребностей в настройке всплывающих подсказок.
Если требования по-прежнему не выполняются, всплывающую подсказку AATooltip
также можно настроить с помощью функции форматирования. Например, настройте свойства экземпляра объекта AATooltip
:
val aaTooltip = AATooltip()
.useHTML(true)
.formatter(
"""
function () {
return ' 🌕 🌖 🌗 🌘 🌑 🌒 🌓 🌔 <br/> '
+ ' Support JavaScript Function Just Right Now !!! <br/> '
+ ' The Gold Price For <b>2020 '
+ this.x
+ ' </b> Is <b> '
+ this.y
+ ' </b> Dollars ';
}
""".trimIndent()
)
.valueDecimals(2)//設置取值精確到小數點後幾位//設置取值精確到小數點後幾位
.backgroundColor("#000000")
.borderColor("#000000")
.style(
AAStyle()
.color("#FFD700")
.fontSize("12 px")
)
Это позволит настроить всплывающие подсказки на графике. Визуальный эффект настроенной всплывающей подсказки показан ниже:
Добавление цветовой полосы для разделения диапазона значений
Добавление цветной линии для разделения диапазона значений ### В настоящее время поддерживаются более десяти типов диаграмм, описание следующее:
enum class AAChartType(val value: String) {
Column ("column"),
Bar ("bar"),
Area ("area"),
Areaspline ("areaspline"),
Line ("line"),
Spline ("spline"),
Scatter ("scatter"),
Pie ("pie"),
Bubble ("bubble"),
Pyramid ("pyramid"),
Funnel ("funnel"),
Columnrange ("columnrange"),
Arearange ("arearange"),
Areasplinerange ("areasplinerange"),
Boxplot ("boxplot"),
Waterfall ("waterfall"),
Polygon ("polygon")
}
enum class AAChartZoomType(val value: String) {
None ("none"), //отключает функцию масштабирования диаграммы (по умолчанию отключает масштабирование)
X ("x"), //поддерживает горизонтальное масштабирование диаграммы по оси X
Y ("y"), //поддерживает вертикальное масштабирование диаграммы по оси Y
XY ("xy"), //поддерживает масштабирование диаграммы по осям XY
}
Примечание: например, если вы установили свойство zoomType
модели AAChartModel
в значение AAChartZoomType.X
, и выполнили масштабирование диаграммы, то после этого, чтобы можно было перемещать диаграмму влево-вправо, используйте двойное нажатие на область представления AAChartView
в виде экрана для перетаскивания влево-вправо. Одновременно в правом верхнем углу экрана автоматически появится кнопка с заголовком «Восстановить масштаб», при нажатии на которую восстанавливается исходный размер и положение диаграммы.
enum class AAChartAnimationType(val value :String){
EaseInQuad ("easeInQuad"),
EaseOutQuad ("easeOutQuad"),
EaseInOutQuad ("easeInOutQuad"),
EaseInCubic ("easeInCubic"),
EaseOutCubic ("easeOutCubic"),
EaseInOutCubic ("easeInOutCubic"),
EaseInQuart ("easeInQuart"),
EaseOutQuart ("easeOutQuart"),
EaseInOutQuart ("easeInOutQuart"),
EaseInQuint ("easeInQuint"),
EaseOutQuint ("easeOutQuint"),
EaseInOutQuint ("easeInOutQuint"),
EaseInSine ("easeInSine"),
EaseOutSine ("easeOutSine"),
EaseInOutSine ("easeInOutSine"),
EaseInExpo ("easeInExpo"),
EaseOutExpo ("easeOutExpo"),
EaseInOutExpo ("easeInOutExpo"),
EaseInCirc ("easeInCirc"),
EaseOutCirc ("easeOutCirc"),
EaseInOutCirc ("easeInOutCirc"),
EaseOutBounce ("easeOutBounce"),
EaseInBack ("easeInBack"),
EaseOutBack ("easeOutBack"),
EaseInOutBack ("easeInOutBack"),
Elastic ("elastic"),
SwingFromTo ("swingFromTo"),
SwingFrom ("swingFrom"),
SwingTo ("swingTo"),
Bounce ("bounce"),
BouncePast ("bouncePast"),
EaseFromTo ("easeFromTo"),
EaseFrom ("easeFrom"),
EaseTo ("easeTo"),
}
Ниже приведены десять типов анимации диаграмм, которые используются в AAInfographics:
Back | Bounce | Circ | Cubic | Elastic |
---|---|---|---|---|
![][1] | ![][2] | ![][3] | ![][4] | ![][5] |
Expo | Quad | Quart | Quint | Sine |
---|---|---|---|---|
![][6] | ![][7] | ![][8] | ![][9] | ![][10] |
AAChartModel
:Свойство | Описание | Диапазон значений |
---|---|---|
title | Заголовок диаграммы | Любая допустимая строка |
subtitle | Подзаголовок диаграммы | Любая допустимая строка |
chartType | Тип диаграммы, может быть указан как любой допустимый тип из перечисления AAChartType . Поддерживаются такие типы диаграмм как столбчатая, линейчатая, гистограмма, график, столбчатая диаграмма с накоплением, линейная диаграмма, кривая, радарная диаграмма, круговая диаграмма, пузырьковая диаграмма, точечная диаграмма, пирамидальная диаграмма, воронкообразная диаграмма, диаграмма областей, столбчатая диаграмма диапазонов |
AAChartType.Column, AAChartType.Bar, AAChartType.Area, AAChartType.AreaSpline, AAChartType.Line, AAChartType.Spline, AAChartType.Pie, AAChartType.Bubble, AAChartType.Scatter, AAChartType.Pyramid, AAChartType.Funnel, AAChartType.Arearange, AAChartType.Columnrange |
stacking | Определяет, будут ли значения каждой серии данных диаграммы суммироваться. По умолчанию используется значение .none , что отключает эффект наложения. Также доступны обычное наложение и наложение в процентах |
AAChartStackingType.None, AAChartStackingType.Normal, AAChartStackingType.Percent |
symbol | Определяет стиль соединения точек кривой диаграммы. Можно выбрать значения круг , квадрат , ромб , треугольник или перевернутый треугольник , по умолчанию используется смешанный стиль |
AAChartSymbolType.Circle, AAChartSymbolType.Square, AAChartSymbolType.Diamond, AAChartSymbolType.Triangle, AAChartSymbolType.TriangleDown |
colorsTheme | Определяет цветовую тему диаграммы | — Лицензия |
Этот проект AAChartCore использует лицензию MIT. Подробности можно найти, нажав на MIT LICENSE.
Содержание, не являющееся частью фреймворка, но зависящее от него, по-прежнему подчиняется своей первоначальной лицензии.
Контакты
Если у вас есть какие-либо проблемы с использованием, вы всегда можете обратиться ко мне с вопросом на GitHub.
GitHub Issues: https://github.com/AAChartModel/AAChartCore/issues
Если вы хотите принять участие в этом проекте с открытым исходным кодом, также всегда рады вашему обращению.
GitHub: https://github.com/AAChartModel StackOverflow: https://stackoverflow.com/users/7842508/codeforu JianShu: http://www.jianshu.com/u/f1e6753d4254 SegmentFault: https://segmentfault.com/u/huanghunbieguan
Список задач
Вы можете оставить комментарий после Вход в систему
Неприемлемый контент может быть отображен здесь и не будет показан на странице. Вы можете проверить и изменить его с помощью соответствующей функции редактирования.
Если вы подтверждаете, что содержание не содержит непристойной лексики/перенаправления на рекламу/насилия/вульгарной порнографии/нарушений/пиратства/ложного/незначительного или незаконного контента, связанного с национальными законами и предписаниями, вы можете нажать «Отправить» для подачи апелляции, и мы обработаем ее как можно скорее.
Опубликовать ( 0 )