2

既存のチャート コードは次のようになります。

jQuery("#staarAllSubjectGrades").kendoChart({
    legend: {
        visible: true,
        position: 'bottom'
    },
    seriesDefaults: {
        type: "column",
        labels: {
            visible: true,
            template: "#= (!value || value < 0) ? 'N/A' : (value).toFixed(0) + '%' #",
        }
    },
    tooltip: {
        visible: true,
        template: "#= series.name #: #= (!value || value < 0) ? 'N/A' : (value).toFixed(0) + '%' #",
        color: 'white'
    },
    dataSource: {
        data: finalData
    },
    series: series,
    valueAxis: {
        majorGridLines: {
            visible: true
        },
        labels: {
            template: "#= (value).toFixed(0) # %"
        },
        visible: true,
        min: 0
    },
    categoryAxis: {
        field: "DISTNAME",
        labels: { visible: this.stateStaarAllSubjectGrades },
        majorGridLines: {
            visible: false
        },
        line: {
            visible: false
        }
    }
})

出力チャートは次のようになります。

既存チャート出力

angular 2剣道チャートの次のコードを使用すると:

<kendo-chart>
    <kendo-chart-category-axis>
        <kendo-chart-category-axis-item [categories]="chartStaarAllSubjectGrades.categories">
            <kendo-chart-category-axis-item-labels [visible]="stateStaarAllSubjectGrades">
            </kendo-chart-category-axis-item-labels>
            <kendo-chart-category-axis-item [majorGridLines]="{ visible: false }" [line]="{ visible: true }">
            </kendo-chart-category-axis-item>
        </kendo-chart-category-axis-item>
    </kendo-chart-category-axis>
    <kendo-chart-series>
        <kendo-chart-series-item [data]="chartStaarAllSubjectGrades.series"> 
        </kendo-chart-series-item>
    </kendo-chart-series>
    <kendo-chart-value-axis>
        <kendo-chart-value-axis-item>
            <kendo-chart-value-axis-item-labels [content]="value + '%'">
            </kendo-chart-value-axis-item-labels>
        </kendo-chart-value-axis-item>
    </kendo-chart-value-axis>
</kendo-chart> 

次に、出力は次のようになります。

新しい出力

チャートの左側に「%」を表示する方法と、既存の出力と同様のラベルを表示する方法を教えてください。

4

1 に答える 1