Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Support
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
T
timebars
Project overview
Project overview
Details
Activity
Releases
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Analytics
Analytics
CI / CD
Repository
Value Stream
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
Nesstar
timebars
Commits
3bd281d8
Commit
3bd281d8
authored
Mar 06, 2014
by
Kjetil Thuen
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
Pass in request details when initializing the chart.
Specify charset for javascript file.
parent
1ad505ca
Changes
5
Hide whitespace changes
Inline
Side-by-side
Showing
5 changed files
with
67 additions
and
15 deletions
+67
-15
README.md
README.md
+8
-0
src/app/main.coffee
src/app/main.coffee
+1
-1
src/app/nesstarloader.coffee
src/app/nesstarloader.coffee
+4
-4
src/app/timebars.coffee
src/app/timebars.coffee
+15
-6
www/index.html
www/index.html
+39
-4
No files found.
README.md
View file @
3bd281d8
...
...
@@ -18,3 +18,11 @@ To run this code you will need npm and grunt installed. Once those are in place,
Then point your (modern) webbrowser to http://localhost:9001
Deploying
---------
To deploy the demo, simply copy the buildt www folder to a web server. To use
the chart in you own page, copy www/js/ and www/css/ to your website, include
them in your page and have a look at look at to see how to insert the cahrt in
your page.
src/app/main.coffee
View file @
3bd281d8
...
...
@@ -5,7 +5,7 @@ timeBarAnim = undefined
currentFrame
=
0
window
.
nesstartimebars
=
{}
window
.
nesstartimebars
.
main
=
(
containerId
)
->
window
.
nesstartimebars
.
main
=
(
containerId
,
dataDesc
)
->
nesstarloader
.
reloadNesstarData
(
(
data
)
->
timebars
.
setupChart
containerId
,
data
currentFrame
=
timebars
.
nextFrame
containerId
,
currentFrame
...
...
src/app/nesstarloader.coffee
View file @
3bd281d8
...
...
@@ -38,8 +38,8 @@ fetchData = (url, callback) ->
request
.
open
'GET'
,
url
,
true
request
.
send
()
assembleDataRequest
=
()
->
datadesc
=
requestDescription
()
assembleDataRequest
=
(
dataDesc
)
->
datadesc
=
dataDesc
or
requestDescription
()
datadesc
.
host
+
":"
+
datadesc
.
port
+
"/"
+
datadesc
.
service
+
"/cube/"
+
...
...
@@ -88,8 +88,8 @@ prepareFuncFactory = (callback) ->
prepareDataForTimeBar
reloadData
=
(
consumerFunc
)
->
reloadData
=
(
consumerFunc
,
dataDesc
)
->
prep
=
prepareFuncFactory
consumerFunc
fetchData
assembleDataRequest
(),
prep
fetchData
assembleDataRequest
(
dataDesc
),
prep
exports
.
reloadNesstarData
=
reloadData
src/app/timebars.coffee
View file @
3bd281d8
...
...
@@ -35,9 +35,11 @@ y = (chartId, val) ->
.
domain
(
d3
.
extent
valuesFromFrame
(
chartId
,
0
),
(
d
)
->
d
.
age
)
.
range
[
0
,
chartHeight
(
chartId
)
]
x_axis
=
d3
.
svg
.
axis
()
.
orient
"bottom"
.
ticks
5
x_axis
=
(
chartId
)
->
d3
.
svg
.
axis
()
.
scale
x
(
chartId
)
.
orient
"bottom"
.
ticks
5
y_axis
=
d3
.
svg
.
axis
()
.
orient
"left"
...
...
@@ -69,6 +71,8 @@ valuesFromFrame = (chartId, frameNum) ->
updateChart
=
(
chartId
,
frameNum
)
->
data
=
valuesFromFrame
chartId
,
frameNum
chart
=
d3
.
select
chartId
+
" svg.chart"
xAxesGroup
=
chart
.
select
"xAxesGroup"
valuepoints
=
chart
.
selectAll
"g.valuepoint"
.
data
data
,
(
d
)
->
d
.
birthyear
...
...
@@ -76,6 +80,8 @@ updateChart = (chartId, frameNum) ->
.
attr
"transform"
,
(
d
,
i
)
->
"translate(0, "
+
(
y
(
chartId
)(
i
)
+
1
)
+
")"
xAxesGroup
.
call
x_axis
(
chartId
)
addBar
valuepoints
.
enter
(),
chartId
valuepoints
.
exit
()
...
...
@@ -110,17 +116,20 @@ setupChart = (chartId, data) ->
d3
.
select
id
.
html
""
d3
.
select
id
svg
=
d3
.
select
id
.
insert
"svg"
.
attr
"class"
,
"chart"
.
attr
"shape-rendering"
,
"geometricPrecision"
.
attr
"width"
,
chartWidth
(
id
)
.
attr
"height"
,
chartHeight
(
id
)
.
call
x_axis
.
call
y_axis
nextFrame
id
,
0
axisGroup
=
svg
.
append
"g"
.
attr
"class"
,
"xAxesGroup"
.
attr
"transform"
,
"translate("
+
chartWidth
(
id
)
/
2
+
","
+
margin
(
id
)
+
")"
window
.
onresize
=
setupChart
exports
.
setupChart
=
setupChart
...
...
www/index.html
View file @
3bd281d8
...
...
@@ -6,17 +6,52 @@
<link
rel=
"stylesheet"
href=
"//netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css"
>
<link
rel=
"stylesheet"
href=
"//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css"
>
<link
href=
"css/timebars.css"
rel=
"stylesheet"
>
<script
src=
"js/timebars.js"
></script>
<script
src=
"js/timebars.js"
charset=
"utf8"
></script>
</head>
<body>
<section
id=
"main"
>
<section
id=
"main"
>
<div
id=
"content"
></div>
<button
id=
"playBtn"
class=
"btn btn-primary"
onclick=
"window.nesstartimebars.toggleAnimation('#content')"
>
<i
class=
"fa fa-play"
></i>
</button>
</section>
</section>
<script>
window
.
nesstartimebars
.
main
(
"
#content
"
);
//Values for hfk Nesstar REST api proxied through Grunt
dataDesc
=
{
host
:
"
http://localhost
"
,
port
:
9001
,
service
:
"
touch/hfk/restdata
"
,
cube
:
"
Fypr-2014-Bef_C1
"
,
filter
:
{
measures
:
[
"
Befolkning
"
],
dimensions
:
[
{
"
id
"
:
"
tid
"
},
{
"
id
"
:
"
alder
"
,
"
members
"
:
[]
},
{
"
id
"
:
"
Kjnn
"
,
"
members
"
:
[
"
1
"
,
"
2
"
]
},
{
"
id
"
:
"
Framskrivingsalternativ
"
,
"
members
"
:
[
"
1
"
]
},
{
"
id
"
:
"
Region
"
,
"
members
"
:
[
"
12
"
]
}
]
}
};
/* #content is the id of the container that should contain the chart. The
dataDesc object is a copy of the hardcoded defaults. Omitting the
dataDesc parameter is equivalent to passing the object above. */
window
.
nesstartimebars
.
main
(
"
#content
"
,
dataDesc
);
</script>
</body>
</html>
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment