Как мне избавиться от этой нежелательной обрезки? - PullRequest
Новая
       15

Как мне избавиться от этой нежелательной обрезки?

0 голосов
/ 16 февраля 2019

У меня есть диаграмма, созданная с помощью библиотеки amCharts.Но я сталкиваюсь с нежелательным кадрированием на изображении, которое находится в верхней части каждого столбца, когда оно поднимается слишком высоко, как я выделил здесь:

Пожалуйста, помогите, я нехотите получить обрезку.

Вот код CSS: 


    #chartdiv {
      width: 100%;
      height: 500px;
      padding: 70px 0;
      border: 3px solid green;
    }

    body {  
      margin: 0 0 0 0;
      overflow:hidden;
      background-color: transparent;
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    }

И вот последняя часть кода JavaScript: 


    // Add bullets
    var bullet = series.bullets.push(new am4charts.Bullet());
    var image = bullet.createChild(am4core.Image);
    image.width = 150;
    image.height = 150;
    image.horizontalCenter = "middle";
    image.verticalCenter = "bottom";
    image.dy = 80;
    image.y = am4core.percent(100);
    image.propertyFields.href = "bullet";
    image.tooltipText = series.columns.template.tooltipText;
    image.propertyFields.fill = "color";
    image.filters.push(new am4core.DropShadowFilter());

РЕДАКТИРОВАТЬ:

Когда я добавляю zoom: 0.5; в CSS-код чарта, это происходит:

Ответы [ 2 ]

0 голосов
/ 18 февраля 2019

Пули, которые вы создали, не рассчитываются в зарезервированной области для вашего графика.Пули на вашем графике очень большие, поэтому они обрезаются сверху.Если вы установите paddingTop на своем графике, это должно решить вашу проблему. 

chart.paddingTop = 50;

Я создал этот код пера из официальных демонстраций amcharts и добавил вашу конфигурацию пули.

0 голосов
/ 16 февраля 2019

Попробуйте ввести:

z-index:5;

в идентификатор "chartdiv" в CSS.Это происходит из-за того, что сверху есть изображение.Функция z-index гарантирует, что чартдив находится на вершине всего остального.Если это не работает, попробуйте увеличить значение z-index.

...