Добавить стили к ярлыкам AmCharts 4 - PullRequest
Новая
       11

Добавить стили к ярлыкам AmCharts 4

0 голосов
/ 07 декабря 2018

У меня есть гистограмма цилиндра в AmCharts 4, которая использует более темную цветовую схему.Цвет текста для надписей на столбцах черный, и он не отображается на темных цветах.

- я использую код JavaScript, показанный в демонстрациях AmChart для 3D-диаграммы цилиндра.

Dark Chart with unreadable labels

Есть ли способ добавить css к тексту метки / метки?

Я хотел бы добавить белую тень для текстана этикетке, чтобы сделать его читабельным.Кроме того, таким образом, это не повлияет на текст, если он находится над белым фоном диаграммы.

Редактировать: 18.12.2008 - я ищу текст, похожий на что-то вроде этого: Readable Chart Labels

Их можно будет увидеть, даже если полоса короткая, а текст лежит на белом фоне.

Ответы [ 2 ]

0 голосов
/ 24 мая 2019

Вы можете использовать CSS, чтобы добавить белый штрих к тексту SVG.Сначала включите CSS-классы для amCharts 4: 

am4core.options.autoSetClassName = true;

А затем добавьте это в свой CSS: 

@supports (paint-order: stroke) {
  .amcharts-LabelBullet text {
    paint-order: stroke;
    stroke: #fff;
    stroke-width: 4px;
    stroke-linecap: butt;
    stroke-linejoin: miter;
    stroke-opacity: 1;
  }
}

Это добавит белый контур 4px ко всему тексту LabelBullet.

0 голосов
/ 12 декабря 2018

Вы можете установить заполнение шаблона этикетки: 

categoryAxis.renderer.labels.template.fill = am4core.color("#fff");

Пожалуйста, проверьте пример здесь: https://codepen.io/team/amcharts/pen/3446cd09288ee4e5901c73b3970adbfe?editors=0010

...