I am very very new to javascript and mithril.js. I am trying to create a very simple bar plot using mithril.js and d3.js. But, I am not having any luck even getting the axis in place.
Firstly, I created a mithril
"svg" component and appended a mithril
"g" compent as follows:
var g = m(gView, {transpose:"translate(10, 10)"})
var svg = m(SVGView, {width: 100, height:100}, g)
where gView
and SVGView
are as follows:
var gView = {
view: function(vnode) {
return m("g", vnode.attrs, [vnode.children]);
}
}
var SVGView = {
view: function(vnode) {
return m("svg", vnode.attrs, [vnode.children]);
}
}
Now I created a simple axis scale and an axis function as follows:
var xScale = d3.scaleLinear()
.domain([0, 10])
.range([0, 40]);
var xAxis = d3.axisBottom(xScale)
How do I add my xAxis
to my mithril component svg
?
I saw many many examples where they just use .call(xAxis)
but this works only with a d3.select()
. I don't want to use and cannot use a d3.select()
as I have to work with mithril.
If my question/code is stupid or if my approach is totally wrong please excuse me. I searched for a simple bar plot build using mithril and I couldn't find anything. So, any help is appreciated or even a redirection to a source where I can read about plotting graphs in mithril is apprecated. Thanks!