Диаграмма Nativescript, как отображать гистограмму с отрицательными значениями

Я хочу, чтобы моя гистограмма всегда начиналась с нуля и росла, если она была положительной, и падала, если отрицательная. Но полоса начинается с минимального диапазона и идет вверх. Как сделать так, чтобы столбцы на моем графике начинались с нуля и вращались вверх или вниз в зависимости от того, положительное или отрицательное значение?

Вот мой код:

<RadCartesianChart tkExampleTitle tkToggleNavButton>
    <CategoricalAxis tkCartesianHorizontalAxis></CategoricalAxis>
    <LinearAxis tkCartesianVerticalAxis></LinearAxis>
    <BarSeries tkCartesianSeries stackMode="Stack" [items]="memberByMonthSource" categoryProperty="month" valueProperty="existing" seriesName="existing" legendTitle="Existing Members"></BarSeries>
    <BarSeries tkCartesianSeries stackMode="Stack" [items]="memberByMonthSource" categoryProperty="month" valueProperty="onhold" seriesName="onhold" legendTitle="On Hold"></BarSeries>
    <BarSeries tkCartesianSeries stackMode="Stack" [items]="memberByMonthSource" categoryProperty="month" valueProperty="new" seriesName="new" legendTitle="New Membership"></BarSeries>
    <BarSeries tkCartesianSeries stackMode="Stack" [items]="memberByMonthSource" categoryProperty="month" valueProperty="rejoin" seriesName="rejoin" legendTitle="Rejoins"></BarSeries>
    <BarSeries tkCartesianSeries stackMode="Stack" [items]="memberByMonthSource" categoryProperty="month" valueProperty="expired" seriesName="expired" legendTitle="Expired"></BarSeries>
    <BarSeries tkCartesianSeries stackMode="Stack" [items]="memberByMonthSource" categoryProperty="month" valueProperty="cancelled" seriesName="cancelled" legendTitle="Cancelled"></BarSeries>

    <Palette tkCartesianPalette seriesName="existing">
        <PaletteEntry tkCartesianPaletteEntry fillColor="rgba(121,50,232,0.15)" strokeColor="rgba(121,50,232,0.5)" strokeWidth="1"></PaletteEntry>
    </Palette>
    <Palette tkCartesianPalette seriesName="onhold">
        <PaletteEntry tkCartesianPaletteEntry fillColor="rgba(255,215,0,0.15)" strokeColor="rgba(255,215,0,0.5)" strokeWidth="1"></PaletteEntry>
    </Palette>
    <Palette tkCartesianPalette seriesName="new">
        <PaletteEntry tkCartesianPaletteEntry fillColor="rgba(16,119,241,0.15)" strokeColor="rgba(16,119,241,0.5)" strokeWidth="1"></PaletteEntry>
    </Palette>
    <Palette tkCartesianPalette seriesName="rejoin">
            <PaletteEntry tkCartesianPaletteEntry fillColor="rgba(135,193,132,0.15)" strokeColor="rgba(135,193,132,0.5)" strokeWidth="1"></PaletteEntry>
        </Palette>
    <Palette tkCartesianPalette seriesName="expired">
        <PaletteEntry tkCartesianPaletteEntry fillColor="rgba(119,119,119,0.15)" strokeColor="rgba(119,119,119,0.5)" strokeWidth="1"></PaletteEntry>
    </Palette>
    <Palette tkCartesianPalette seriesName="cancelled">
        <PaletteEntry tkCartesianPaletteEntry fillColor="rgba(255,153,153,0.15)" strokeColor="rgba(255,153,153,0.5)" strokeWidth="1"></PaletteEntry>
    </Palette>
</RadCartesianChart>

Сериалы с истекшим сроком действия и отмененные сериалы имеют отрицательные значения.


nativescript angular2-nativescript nativescript-angular nativescript-telerik-ui
person Ryan    schedule 28.06.2018    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Попробуйте добавить минимальные и максимальные свойства к линейной оси следующим образом:

<LinearAxis tkCartesianVerticalAxis minimum="-50" maximum="50"></LinearAxis>
person Gustavo Hernández    schedule 08.05.2019
comment
Теперь проблема в том, что я заранее не знаю минимум и максимум. - person Ryan; 29.08.2019
comment
@Ryan использует OnInit, чтобы вычислить необходимые значения и сохранить их в переменной в файле .ts, а затем получить доступ к переменной из файла .html с помощью {{variableName}}. - person Gustavo Hernández; 06.12.2019