How to use the d3fc.scale function in d3fc

export default function() {
    var navHeight = 100; // Also maintain in variables.less
    var bottomMargin = 40; // Also maintain in variables.less
    var navChartHeight = navHeight - bottomMargin;
    var borderWidth = 1; // Also maintain in variables.less
    var extentHeight = navChartHeight - borderWidth;
    var barHeight = extentHeight;
    var handleCircleCenter = borderWidth + barHeight / 2;
    var handleBarWidth = 2;
    var yExtentPadding = [0, 0.04];
    var numberOfSamples = 200;

    var dispatch = d3.dispatch(event.viewChange);
    var xScale = fc.scale.dateTime();
    var yScale = d3.scale.linear();

    var navChart = fc.chart.cartesian(xScale, yScale)
        .yTicks(0)
        .margin({
            bottom: bottomMargin      // Variable also in navigator.less - should be used once ported to flex
        })
        .xOuterTickSize(0)
        .yOuterTickSize(0);

    var viewScale = fc.scale.dateTime();

    var area = fc.series.area()
        .xValue(function(d) { return d.date; })
        .y1Value(function(d) { return d.close; })
        .y0Value(function() { return yScale.domain()[0]; });

var yExtentPadding = [0, 0.04];
    var numberOfSamples = 200;

    var dispatch = d3.dispatch(event.viewChange);
    var xScale = fc.scale.dateTime();
    var yScale = d3.scale.linear();

    var navChart = fc.chart.cartesian(xScale, yScale)
        .yTicks(0)
        .margin({
            bottom: bottomMargin      // Variable also in navigator.less - should be used once ported to flex
        })
        .xOuterTickSize(0)
        .yOuterTickSize(0);

    var viewScale = fc.scale.dateTime();

    var area = fc.series.area()
        .xValue(function(d) { return d.date; })
        .y1Value(function(d) { return d.close; })
        .y0Value(function() { return yScale.domain()[0]; });

    var line = fc.series.line()
        .xValue(function(d) { return d.date; })
        .yValue(function(d) { return d.close; });
    var brush = d3.svg.brush();
    var navMulti = fc.series.multi()
        .series([area, line, brush])
        .decorate(function(selection) {
            var enter = selection.enter();

            selection.selectAll('.background, .extent')

export default function() {
    var xScale = fc.scale.dateTime();
    var ticks = dateTimeTickValues();

    var xAxis = fc.svg.axis()
      .scale(xScale)
      .orient('bottom')
      .decorate(function(s) {
          s.selectAll('text')
              .each(function() {
                  var text = d3.select(this);
                  var split = text.text().split(',');
                  text.text(null);
                  text.append('tspan')
                      .attr('class', 'axis-label-main')
                      .attr('x', 0)
                      .text(split[0]);
                  text.append('tspan')

var model = selection.datum();

        xScale.domain(model.viewDomain)
            .discontinuityProvider(model.discontinuityProvider);

        var minimumTickCount = 2,
            tickFrequencyPixels = 100,
            tickCount = responsiveTickCount(xScale.range()[1], tickFrequencyPixels, minimumTickCount),
            period = model.period;

        var tickValues = ticks.domain(xScale.domain())
            .discontinuityProvider(model.discontinuityProvider)
            .ticks(tickCount)
            .minimumTickInterval([period.d3TimeInterval.unit, period.d3TimeInterval.value])();

        xAxis.tickValues(fc.scale.dateTime.tickTransformer(tickValues, model.discontinuityProvider, model.viewDomain))
            .tickFormat(d3.time.format(tickValues.format));

        selection.call(xAxis);
    }

function initialiseSources() {
    return {
      generated: model.data.source(
        dataGeneratorAdaptor(),
        null,
        null,
        null,
        fc.scale.discontinuity.identity()
      ),
      bitcoin: model.data.source(
        gdaxAdaptor(),
        gdaxHistoricErrorResponseFormatter,
        gdaxWebSocket(),
        gdaxStreamingErrorResponseFormatter,
        fc.scale.discontinuity.identity()
      ),
      quandl: model.data.source(
        quandlAdaptor(),
        quandlHistoricErrorResponseFormatter,
        null,
        null,
        skipWeekendsDiscontinuityProvider()
      ),
      stockFlux: model.data.source(

export default function() {
    var dispatch = d3.dispatch(event.viewChange);
    var xScale = fc.scale.dateTime();
    var yScale = d3.scale.linear();
    var trackingLatest = true;
    var yAxisWidth = 60;

    var multi = fc.series.multi();
    var chart = fc.chart.cartesian(xScale, yScale)
        .plotArea(multi)
        .xTicks(0)
        .yOrient('right')
        .margin({
            top: 0,
            left: 0,
            bottom: 0,
            right: yAxisWidth
        });
    var zoomWidth;

export default function() {
    var xScale = fc.scale.dateTime();
    var yScale = d3.scale.linear();
    var barWidth = fc.util.fractionalBarWidth(0.75);
    var xValue = function(d) { return d.date; };
    var xValueScaled = function(d, i) { return xScale(xValue(d, i)); };
    var yLowValue = function(d) { return d.low; };
    var yHighValue = function(d) { return d.high; };
    var yCloseValue = function(d) { return d.close; };

    var candlestickSvg = fc.svg.candlestick()
      .x(function(d) { return xScale(d.date); })
      .open(function(d) { return yScale(d.open); })
      .high(function(d) { return yScale(yHighValue(d)); })
      .low(function(d) { return yScale(yLowValue(d)); })
      .close(function(d) { return yScale(d.close); });

    var upDataJoin = fc.util.dataJoin()

switch (series) {
            case closeLine:
                return [this.data[this.data.length - 1]];
            case crosshair:
                return crosshairData;
            default:
                return this.visibleData;
            }
        })
        .decorate(function(selection) {
            selection.enter()
                .select('.area')
                .attr('fill', 'url("#primary-area-series-gradient")');
        });

    var xScale = fc.scale.dateTime();
    var yScale = d3.scale.linear();

    var primaryChart = fc.chart.cartesian(xScale, yScale)
      .xTicks(0)
      .yOrient('right')
      .margin({
          top: 0,
          left: 0,
          bottom: 0,
          right: yAxisWidth
      })
      .decorate(function(selection) {
          selection.enter()
              .selectAll('defs')
              .data([0])
              .enter()