我有一个显示总销售数字的图表。问题是我不想显示0美元起的折线图,而是50美元起的折线图?
我看到this answer通过覆盖onLoad设置解决了该问题,但是我无法使其工作。必须有明确的方法来做到这一点,不是吗?
<canvas id="salesChart" style="height: 180px;"></canvas>
<script>
// Get context with jQuery - using jQuery's .get() method.
var salesChartCanvas = $("#salesChart").get(0).getContext("2d");
// This will get the first returned node in the jQuery collection.
var salesChart = new Chart(salesChartCanvas);
var salesChartData = {
labels: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
datasets: [
{
label: "HeartBeat",
fillColor: "rgba(60,141,188,0.9)",
strokeColor: "rgba(60,141,188,0.8)",
pointColor: "#3b8bba",
pointStrokeColor: "rgba(60,141,188,1)",
pointHighlightFill: "#fff",
pointHighlightStroke: "rgba(60,141,188,1)",
data: [89.90, 94.00, 87.64, 90.91, 93.41, 88.89, 94.17, 92.00, 93.68, 96.15, 0.00, 0.00]
}
]
};
var salesChartOptions = {
showScale: true, //Boolean - If we should show the scale at all
scaleShowGridLines: true, //Boolean - Whether grid lines are shown across the chart
scaleGridLineColor: "rgba(0,0,0,.05)", //String - Colour of the grid lines
scaleGridLineWidth: 1, //Number - Width of the grid lines
scaleShowHorizontalLines: true, //Boolean - Whether to show horizontal lines (except X axis)
scaleShowVerticalLines: true, //Boolean - Whether to show vertical lines (except Y axis)
bezierCurve: true, //Boolean - Whether the line is curved between points
bezierCurveTension: 0.3, //Number - Tension of the bezier curve between points
pointDot: true, //Boolean - Whether to show a dot for each point
pointDotRadius: 4, //Number - Radius of each point dot in pixels
pointDotStrokeWidth: 1, //Number - Pixel width of point dot stroke
pointHitDetectionRadius: 20, //Number - amount extra to add to the radius to cater for hit detection outside the drawn point
datasetStroke: true, //Boolean - Whether to show a stroke for datasets
datasetStrokeWidth: 2, //Number - Pixel width of dataset stroke
datasetFill: true, //Boolean - Whether to fill the dataset with a color
//String - A legend template
legendTemplate: "<ul class=\"<%=name.toLowerCase()%>-legend\"><% for (var i=0; i<datasets.length; i++){%><li><span style=\"background-color:<%=datasets[i].lineColor%>\"></span><%=datasets[i].label%></li><%}%></ul>",
//Boolean - whether to maintain the starting aspect ratio or not when responsive, if set to false, will take up entire container
maintainAspectRatio: true,
//Boolean - whether to make the chart responsive to window resizing
responsive: true
};
//Create the line chart
salesChart.Line(salesChartData, salesChartOptions);
</script>