0
私はJavaScriptに新しい、私は棒グラフを描画するためにplottable jsを使用しています、棒グラフは大丈夫ですが、x軸ラベルのフォントサイズが大きいです、誰も私はどのようにフォントサイズを減らすのを助けることができますか?ここに私のhtmlとjavascriptのコードです。plottable js棒グラフでフォントサイズを変更するにはどうすればよいですか?
HTMLコード:
<svg height="200px" width="400px" style="margin-left:auto; margin-right:auto; display:block;" id="Individual-assessment-score-graph">
</svg>
JSコード:
<script>
var data = [
<% for(var i=0; i < studentData.pageInclination.assessmentScoreChart.length; i++) {%>
{
testScore: <%= studentData.pageInclination.assessmentScoreChart[i].testScore %>,
barColor: <%= studentData.pageInclination.assessmentScoreChart[i].barColor %>,
chartLegend: "<%= studentData.pageInclination.assessmentScoreChart[i].chartLegend %>"
},
<%}%>
];
var colors = [
<% for(var i=0; i < studentData.pageInclination.chartBarColors.length; i++) {%>
"<%= studentData.pageInclination.chartBarColors[i] %>",
<%}%>
];
var colorScale = new Plottable.Scales.Color();
colorScale.range(colors);
var dataSet = new Plottable.Dataset(data);
var xAccessor = function(datum, index, dataset) {
return datum.chartLegend;
};
var xScale = new Plottable.Scales.Category();
var yScale = new Plottable.Scales.Linear();
var yAccessor = function(datum, index, dataset) {
return datum.testScore;
};
var plot = new Plottable.Plots.Bar();
plot.addDataset(dataSet);
plot.x(xAccessor, xScale);
var xAxis = new Plottable.Axes.Category(xScale, "bottom");
var yAxis = new Plottable.Axes.Numeric(yScale, "left");
var chart = new Plottable.Components.Table([
[yAxis, plot],
[null, xAxis]
]);
chart.renderTo("svg#Individual-assessment-score-graph");
</script>