playground
/
c3
mirror of https://github.com/masayuki0812/c3.git
1
0
Fork 0
Code Issues Releases Activity
Browse Source

Fix grid/axis sample for timeseries as number - #311

pull/329/head
Masayuki Tanaka 11 years ago
parent
d7b7b0645c
commit
ee66064979
3 changed files with 137 additions and 1 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 8
      htdocs/index.html
  2. 57
      htdocs/samples/axes_x_range_timeseries.html
  3. 73
      htdocs/samples/grid_x_lines_timeseries.html

8
htdocs/index.html
Unescape View File

@ -139,6 +139,9 @@
<a href="./samples/axes_x_tick_rotate.html" target="_blank"> <a href="./samples/axes_x_tick_rotate.html" target="_blank">
Set rotation for x axis Set rotation for x axis
</a> </a>
<a href="./samples/axes_x_range_timeseries.html" target="_blank">
Set range in timeseries for x axis
</a>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
@ -226,11 +229,14 @@
Show x/y grids Show x/y grids
</a> </a>
<a href="./samples/grids_timeseries.html" target="_blank"> <a href="./samples/grids_timeseries.html" target="_blank">
Show x/y grids with timeseries&raquo; Show x/y grids with timeseries
</a> </a>
<a href="./samples/grid_x_lines.html" target="_blank"> <a href="./samples/grid_x_lines.html" target="_blank">
Show optional x grids Show optional x grids
</a> </a>
<a href="./samples/grid_x_lines_timeseries.html" target="_blank">
Show optional x grids with timeseries
</a>
</div> </div>
<div class="col-md-4"> <div class="col-md-4">
<h3>Region</h3> <h3>Region</h3>

57
htdocs/samples/axes_x_range_timeseries.html
Unescape View File

@ -0,0 +1,57 @@
<html>
<head>
<link rel="stylesheet" type="text/css" href="/css/c3.css">
</head>
<body>
<div id="chart1"></div>
<div id="chart2"></div>
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script src="/js/c3.js"></script>
<script>
var chart1 = c3.generate({
"bindto": "#chart1",
"axis": {
"x": {
"type": "timeseries",
"min": 1401879600000,
"max": 1401969600000,
}
},
"data": {
"type": "line",
"columns": [
["epoch", 1401879600000, 1401883200000, 1401886800000],
["y", 1955, 2419, 2262]
],
"xs": {
"y": "epoch"
}
}
});
var chart2 = c3.generate({
"bindto": "#chart2",
"axis": {
"x": {
"type": "timeseries",
"min": new Date(1401879600000),
"max": new Date(1401969600000),
}
},
"data": {
"type": "line",
"columns": [
["epoch", 1401879600000, 1401883200000, 1401886800000],
["y", 1955, 2419, 2262]
],
"xs": {
"y": "epoch"
}
}
});
</script>
</body>
</html>

73
htdocs/samples/grid_x_lines_timeseries.html
Unescape View File

@ -0,0 +1,73 @@
<html>
<head>
<link rel="stylesheet" type="text/css" href="/css/c3.css">
</head>
<body>
<div id="chart1"></div>
<div id="chart2"></div>
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script src="/js/c3.js"></script>
<script>
var chart1 = c3.generate({
"bindto": "#chart1",
"axis": {
"x": {
"type": "timeseries",
"tick": {
format: '%Y-%m-%d %H:%M:%S'
}
}
},
"grid": {
"x": {
"lines": [
{ "value": 1401883200000, "text": new Date(1401883200000), "color": "#f00" },
]
}
},
"data": {
"type": "line",
"columns": [
["epoch", 1401879600000, 1401883200000, 1401886800000],
["y", 1955, 2419, 2262]
],
"xs": {
"y": "epoch"
}
}
});
var chart2 = c3.generate({
"bindto": "#chart2",
"axis": {
"x": {
"type": "timeseries",
"tick": {
format: '%Y-%m-%d %H:%M:%S'
}
}
},
"grid": {
"x": {
"lines": [
{ "value": new Date(1401883200000), "text": new Date(1401883200000), "color": "#f00" },
]
}
},
"data": {
"type": "line",
"columns": [
["epoch", 1401879600000, 1401883200000, 1401886800000],
["y", 1955, 2419, 2262]
],
"xs": {
"y": "epoch"
}
}
});
</script>
</body>
</html>
Write Preview
Loading…
Cancel
Save