当只有几个值时,Dimple Js 会重复打勾
Dimple Js repeats ticks when there are only a few values
当我只有一两个数据点时,dimple js 会重复相同的刻度。我如何让它不那样做?
示例
<head>
<script src="http://d3js.org/d3.v3.min.js"></script>
<script src="http://dimplejs.org/dist/dimple.v2.1.2.min.js"></script>
</head>
<body>
<script type="text/javascript">
var svg = dimple.newSvg("body", 800, 600);
var data = [
{ "Word":"1/2/1990", "Awesomeness":2000 },
{ "Word":"1/1/1990", "Awesomeness":3000 }
];
var chart = new dimple.chart(svg, data);
chart.addTimeAxis("x", "Word");
chart.addMeasureAxis("y", "Awesomeness");
chart.addSeries(null, dimple.plot.line);
chart.draw();
</script>
</body>
通常您会设置 axis.ticks but when using a time axis you'll want to set timePeriod and timeInterval。这将在数据集中每天设置一个刻度线。
var xAxis = chart.addTimeAxis("x", "Word");
xAxis.timePeriod = d3.time.days;
xAxis.timeInterval = 1;
xAxis.tickFormat = "%A";
chart.addMeasureAxis("y", "Awesomeness");
chart.addSeries(null, dimple.plot.line);
chart.draw();
当我只有一两个数据点时,dimple js 会重复相同的刻度。我如何让它不那样做?
示例
<head>
<script src="http://d3js.org/d3.v3.min.js"></script>
<script src="http://dimplejs.org/dist/dimple.v2.1.2.min.js"></script>
</head>
<body>
<script type="text/javascript">
var svg = dimple.newSvg("body", 800, 600);
var data = [
{ "Word":"1/2/1990", "Awesomeness":2000 },
{ "Word":"1/1/1990", "Awesomeness":3000 }
];
var chart = new dimple.chart(svg, data);
chart.addTimeAxis("x", "Word");
chart.addMeasureAxis("y", "Awesomeness");
chart.addSeries(null, dimple.plot.line);
chart.draw();
</script>
</body>
通常您会设置 axis.ticks but when using a time axis you'll want to set timePeriod and timeInterval。这将在数据集中每天设置一个刻度线。
var xAxis = chart.addTimeAxis("x", "Word");
xAxis.timePeriod = d3.time.days;
xAxis.timeInterval = 1;
xAxis.tickFormat = "%A";
chart.addMeasureAxis("y", "Awesomeness");
chart.addSeries(null, dimple.plot.line);
chart.draw();