Question

条形图上的标签并未全部显示。也许是因为它太窄了，所以他们交替出现。

我尝试了很多东西，没有任何效果：

间隔：1
ticklength：1
设定文化

http://www.jeroenchristens.be/ReadingLists/Graph2

<div id="chartContainer2"></div>
<script type="text/javascript">
                var result2 = @Html.Raw(ViewBag.DataPoints2);
                var dataPoints2 =[];
                for(var i = 0; i < result2.length; i++){
                    dataPoints2.push({label:result2[i].x, y:result2[i].y});
                }

                                                                   window.onload = function () {
                                                                       var chart2 = new CanvasJS.Chart("chartContainer2", {
                                                                           theme: "theme2",
                                                                           animationEnabled: true,
                                                                           title: {
                                                                               text: "series"
                                                                           },
                                                                           subtitles: [
                                                                               { text: "" }
                                                                           ],
                                                                           data: [
                                                                               {
                                                                                   zoomEnabled: true,
                                                                                   animationEnabled: true,
                                                                                   indexLabelFontFamily: "Garamond",
                                                                                   indexLabelFontSize: 15,
                                                                                   indexLabel: "{y}",

                                                                                                                                                                          axisX: {
                                                                                       labelFontSize: 10,
                                                                                       interval: 1,
                                                                                       labelAngle: -70,
                                                                                       interlacedColor: "#F8F1E4",
                                                                                       tickLength: 1,
                                                                                       labelMaxWidth: 70

                                                                                   },
                                                                                   axisY: {
                                                                                       labelFontSize: 10,
                                                                                       interval: 1,
                                                                                       labelAngle: -70,
                                                                                       interlacedColor: "#F8F1E4",
                                                                                       tickLength: 1,
                                                                                       labelMaxWidth: 100



                                                                                   },
                                                                                   showInLegend: true,
                                                                                   toolTipContent: "{label} {y}",
                                                                                   type: "bar", //change type to bar, line, area, pie, etc
                                                                                   dataPoints: dataPoints2
                                                                               }
                                                                           ]
                                                                       });
                                                                       chart2.render();

                                                                   };

Answer 1

axisX和axisY是图表的属性，而不是dataSeries。以下代码在您的情况下应该可以正常工作。

window.onload = function () {
var chart2 = new CanvasJS.Chart("chartContainer2", {
    theme: "theme2",
    animationEnabled: true,
    title: {
        text: "series"
    },
    subtitles: [{ 
        text: "" 
    }],
    axisX: {
        labelFontSize: 10,
        interval: 1,
        labelAngle: -70,
        interlacedColor: "#F8F1E4",
        tickLength: 1,
        labelMaxWidth: 70
    },
    axisY: {
        labelFontSize: 10,
        interval: 1,
        labelAngle: -70,
        interlacedColor: "#F8F1E4",
        tickLength: 1,
        labelMaxWidth: 100
    },
    data: [{
        zoomEnabled: true,
        animationEnabled: true,
        indexLabelFontFamily: "Garamond",
        indexLabelFontSize: 15,
        indexLabel: "{y}",
        showInLegend: true,
        toolTipContent: "{label} {y}",
        type: "bar", //change type to bar, line, area, pie, etc
        dataPoints: dataPoints2
    }]
});

chart2.render();
}

CanvasJS栏并非显示所有标签

1 个答案: