how can I use extent() (or what else?) from cubism.js chart to set y axis scale?

how can I use extent() (or what else?) from cubism.js chart to set y axis
scale?

I'm trying to set the y-axis scale dynamically as high/low values scroll
on or off.
I'm stuck on where is the right spot to set the y axis scale in order for
it to be dynamic? (with respect to full set of cubism metric, not just
latest 7 fetched via json)? And I guess what method call? (as everything
I've tried just leads to "not a function" errors, or if I try to
console.log something before using it, is returning null).

I have a real-time json web request happening once per second, but based
on how cubism.js works, (after initial fetch of full time range) it only
gets 7 recent values (so I don't think within my d3.json() call is the
right place to get at the full data range). Nonetheless, that IS the
?only? section that is already getting called every second so maybe I'm
wrong.
The dynamic scale part is working fine within the canvas (I ended up
basing it on comparison chart rather than horizon - re an earlier
question), I just can't get the svg y-axis scale to match the canvas
comparison chart y scale. (linechart in the following is essentially a
hacked copy of cubism comparison chart).
Notice I CAN set the scale statically (19000 to 19100 in this example and
image) but only on initial load. As you can see by the mouse hover value
22281 in the image, the svg scale is not updated.
// y axis stuff:
var yAxis = d3.svg.axis()
.orient("left");
yAxis.scale().domain([19000, 19100]);
yAxis.scale().range([300, 0]);
var ySvg = d3.select("body").append("svg")
.attr("class", "y axis")
.attr("width", 150)
.attr("height", 300);
ySvg.append("g")
.attr("class", "y axis")
.attr("transform", "translate(50,0)")
.call(yAxis);
// cubism canvas (main graph area) stuff:
var myContext = cubism.context()
.serverDelay(1000*60*315)
.step(1000)
.size(600);
d3.select("body").append("div")
.attr("class", "rule")
.call(myContext.rule());
var myMetr = myContext.metric(function(start, stop, step, callback) {
d3.json("http://myhostname.example.com/my.json.php?t0=" +
(start/1000) + "&t1=" + (stop/1000) + "&ss=" + step/1000,
function(er, dt) {
if (!dt) { return callback(new Error("unable to load
data")); };
yAxis.scale().domain([d3.min(dt.val), d3.max(dt.val)]);
/*
console.log(d3.min(dt.val), "___", d3.max(dt.val));
console.log(myLineCht.extent());
console.log( yAxis.scale().domain());
console.log( yAxis.scale().range());
*/
callback(null, dt.val);
});
});
var myLineCht = myContext.linechart()
.format(d3.format(".2f"))
.height(300)
.title("mag_a, nT");
d3.select("body").selectAll(".linechart")
.data([myMetr])
.enter().append("div")
.attr("class", "linechart")
.call(myLineCht);
// x axis stuff:
var xSvg = d3.select("body").append("svg")
.attr("class", "x axis")
.attr("height", 30)
.attr("width", 600);
var timeAxis = myContext.axis()
.ticks(2)
.tickSubdivide(4)
.tickFormat(d3.time.format.utc("%H:%M utc"))
.orient("bottom");
xSvg.append("g")
.attr("class", "x axis")
.call(timeAxis);
myContext.on("focus", function(i) {
d3.selectAll(".value").style("right", i == null ? null :
myContext.size() - i + "px");
});
I guess as a pre-question (part of what is making it tough for me to
shrink this example), am I understanding this correctly that cubism.js can
only use canvas and the axis features of d3.js can only use svg?
I also tried setting yAxis directly from cubism extent()
comparison.scale() etc but no joy.