Chris Viau biovisualize

## chart.js
var lineChart = chart.line('#chart')
	.height(100)
	.width(100)
	.dimension(dimension)
	.group(group)

## events.js
datahub.chart.multi({
    parent: container
})
.on(‘hover’, function(d) { console.log(d) })

## external_api.js
// separate init from setting config and data
var chart = datahub.chart.multi({
    parent: container
})

chart.setConfig({
    width: container.clientWidth,
    autoScaleY: true
})

## wrapper.js
(function(root, factory) {
    if (typeof module === ‘object’ && module.exports) {
        factory(module.exports,
            require(‘d3’),
            require(‘./datahub-utils.js’).utils,
            require(‘./datahub-common.js’).common
        )
    } else {
        factory((root.datahub = root.datahub || {}), root.d3, root.datahub.utils, root.datahub.common)
    }

## template.js
var containerNode = config.parent.querySelector('.chart-container')
if(!containerNode) {
    var template = '<div class=”chart-container”>'
        + '<svg class=”datahub-chart”>'
            + '<g class=”panel”>'
                + '<g class=”stripe-group”></g>'
                + '<g class=”bar-group”></g>'
                + '<g class=”y axis”></g>'
                + '<g class=”x axis”></g>'
                + '<g class=”title-container”>'

## pipeline.js
var chart = utils.pipeline(
    dataValidator,
	dataAdapter,
	template,
	scaleX,
	scaleY,
	eventsPanel,
	common.axisX,
	common.axisY,
	stripes,

## module.js
var scaleX = function(config) {
    var scaleX = d3.scaleBand()
    	.domain(config.data.labels)
    	.rangeRound([0, config.width])
        .paddingInner(0.4)
        .paddingOuter(0.2)

    return {
        scaleX: scaleX
    }

## index.html
<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <style>
    .view-container {
        min-height: 300px;
        border: 1px solid black;
        padding: 20px;

## face.jpg

      
              3 files
            
          
              2 forks
            
          
              0 comments
            
          
              0 stars
            
          
                biovisualize
                / face.jpg
            
            
              Last active
              May 14, 2018 06:53
            
          
## index.html
<!DOCTYPE html>
	<head>
		<meta charset="utf-8">
		<script src="https://d3js.org/d3.v3.js"></script>
		<style>
		</style>
	</head>
	<body>
		<div class="first">Box 1</div>
		<div class="second">Box 2</div>
	var lineChart = chart.line('#chart')
	.height(100)
	.width(100)
	.dimension(dimension)
	.group(group)
	datahub.chart.multi({
	parent: container
	})
	.on(‘hover’, function(d) { console.log(d) })
	// separate init from setting config and data
	var chart = datahub.chart.multi({
	parent: container
	})

	chart.setConfig({
	width: container.clientWidth,
	autoScaleY: true
	})
	(function(root, factory) {
	if (typeof module === ‘object’ && module.exports) {
	factory(module.exports,
	require(‘d3’),
	require(‘./datahub-utils.js’).utils,
	require(‘./datahub-common.js’).common
	)
	} else {
	factory((root.datahub = root.datahub \|\| {}), root.d3, root.datahub.utils, root.datahub.common)
	}
	var containerNode = config.parent.querySelector('.chart-container')
	if(!containerNode) {
	var template = '<div class=”chart-container”>'
	+ '<svg class=”datahub-chart”>'
	+ '<g class=”panel”>'
	+ '<g class=”stripe-group”></g>'
	+ '<g class=”bar-group”></g>'
	+ '<g class=”y axis”></g>'
	+ '<g class=”x axis”></g>'
	+ '<g class=”title-container”>'
	var chart = utils.pipeline(
	dataValidator,
	dataAdapter,
	template,
	scaleX,
	scaleY,
	eventsPanel,
	common.axisX,
	common.axisY,
	stripes,
	var scaleX = function(config) {
	var scaleX = d3.scaleBand()
	.domain(config.data.labels)
	.rangeRound([0, config.width])
	.paddingInner(0.4)
	.paddingOuter(0.2)

	return {
	scaleX: scaleX
	}
	<!DOCTYPE html>
	<html>

	<head>
	<meta charset="UTF-8">
	<style>
	.view-container {
	min-height: 300px;
	border: 1px solid black;
	padding: 20px;