How to use the d3fc.seriesSvgLine function in d3fc

To help you get started, we’ve selected a few d3fc examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github ScottLogic / StockFlux / legacy / src / child / components / minichart / Minichart.js View on Github external
// only use that extent.
        const closeExtent = extentLinear().accessors([(d) => d.close])(data);
        const yScale = scaleLinear()
            .domain(closeExtent)
            .range([height, 0])
            .nice();

        const area = seriesSvgArea()
            .crossValue((d) => d.date)
            .baseValue((_) => closeExtent[0])
            .mainValue((d) => d.close)
            .decorate((selection) => {
                selection.attr('fill', `url(#${stockCode}-minichart-gradient)`);
            });

        const line = seriesSvgLine()
            .crossValue((d) => d.date)
            .mainValue((d) => d.close);

        const point = seriesSvgPoint()
            .crossValue((d) => d.date)
            .mainValue((d) => d.close);

        const multi = seriesSvgMulti()
            .series([area, line, point])
            .xScale(xScale)
            .yScale(yScale)
            .mapping((_, index, series) => {
                switch (series[index]) {
                case point:
                    return [data.slice(0)[0]];
                default:
github ScottLogic / StockFlux / packages / stockflux-watchlist / src / components / minichart / Minichart.js View on Github external
const getLine = () => {
  return seriesSvgLine()
    .crossValue(d => d.date)
    .mainValue(d => d.close);
};
github finos / perspective / packages / perspective-viewer-d3fc / src / js / series / lineSeries.js View on Github external
export function lineSeries(settings, color) {
    let series = fc.seriesSvgLine();

    series = series.decorate(selection => {
        selection.style("stroke", d => withoutOpacity(color(d[0] && d[0].key)));
    });

    return series.crossValue(d => d.crossValue).mainValue(d => d.mainValue);
}