Obesity is a risk factor for type 2 diabetes (T2D), however not all obese individuals develop the disease. In this study, we aimed to investigate the cause of differential insulin secretion capacity of pancreatic islets from T2D and non-T2D (ND) especially obese donors (BMI ≥30 kg/m²). Islets from obese T2D donors had reduced insulin secretion, decreased β-cell exocytosis and higher expression of fatty acid translocase CD36. We tested the hypothesis that CD36 is a key molecule in the reduced insulin secretion capacity. Indeed, CD36 overexpression led to decreased insulin secretion, impaired exocytosis and reduced granule docking. This was accompanied with reduced expression of the exocytotic proteins, SNAP25, STXBP1 and VAMP2, likely because CD36 induced down-regulation of the IRS proteins, suppressed insulin signaling PI3K-AKT pathway and increased nuclear localization of the transcription factor FoxO1. CD36 antibody treatment of the human β-cell line, EndoC-βH1, increased IRS1 and exocytotic protein levels, improved granule docking and enhanced insulin secretion. Our results demonstrate that β-cells from obese T2D donors have dysfunctional exocytosis likely due to an abnormal lipid handling represented by differential CD36 expression. Hence, CD36 could be a key molecule to limit β-cell function in T2D associated with obesity.

Type 1 diabetes mellitus (T1DM) has traditionally been characterized by a complete destruction of β-cell mass (BCM); however, there is growing evidence of possible residual BCM present in T1DM. Given the absence of in vivo tools to measure BCM, routine clinical measures of β-cell function (e.g., C-peptide release) may not reflect BCM. We previously demonstrated the potential utility of PET imaging with the dopamine D₂ and D₃ receptor agonist 3,4,4a,5,6,10b-hexahydro-2H-naphtho[1,2-b][1,4]oxazin-9-ol (¹¹C-(+)-PHNO) to differentiate between healthy control (HC) and T1DM individuals. Methods: Sixteen individuals participated (10 men, 6 women; 9 HCs, 7 T1DMs). The average duration of diabetes was 18 ± 6 y (range, 14–30 y). Individuals underwent PET/CT scanning with a 120-min dynamic PET scan centered on the pancreas. One- and 2-tissue-compartment models were used to estimate pancreas and spleen distribution volume. Reference region approaches (spleen as reference) were also investigated. Quantitative PET measures were correlated with clinical outcome measures. Immunohistochemistry was performed to examine colocalization of dopamine receptors with endocrine hormones in HC and T1DM pancreatic tissue. Results: C-peptide release was not detectable in any T1DM individuals, whereas proinsulin was detectable in 3 of 5 T1DM individuals. Pancreas SUV ratio minus 1 (SUVR-1) (20–30 min; spleen as reference region) demonstrated a statistically significant reduction (–36.2%) in radioligand binding (HCs, 5.6; T1DMs, 3.6; P = 0.03). Age at diagnosis correlated significantly with pancreas SUVR-1 (20–30 min) (R² = 0.67, P = 0.025). Duration of diabetes did not significantly correlate with pancreas SUVR-1 (20–30 min) (R² = 0.36, P = 0.16). Mean acute C-peptide response to arginine at maximal glycemic potentiation did not significantly correlate with SUVR-1 (20–30 min) (R² = 0.57, P = 0.05), nor did mean baseline proinsulin (R² = 0.45, P = 0.10). Immunohistochemistry demonstrated colocalization of dopamine D₃ receptor and dopamine D₂ receptor in HCs. No colocalization of the dopamine D₃ receptor or dopamine D₂ receptor was seen with somatostatin, glucagon, or polypeptide Y. In a separate T1DM individual, no immunostaining was seen with dopamine D₃ receptor, dopamine D₂ receptor, or insulin antibodies, suggesting that loss of endocrine dopamine D₃ receptor and dopamine D₂ receptor expression accompanies loss of β-cell functional insulin secretory capacity. Conclusion: Thirty-minute scan durations and SUVR-1 provide quantitative outcome measures for ¹¹C-(+)-PHNO, a dopamine D₃ receptor–preferring agonist PET radioligand, to differentiate BCM in T1DM and HCs.

Massimo Cigolini
Mar 1, 2006; 29:722-724
BR Cardiovascular and Metabolic Risk

OBJECTIVE

In patients with type 2 diabetes (T2D) and critical limb ischemia (CLI), migration of circulating CD34⁺ cells predicted cardiovascular mortality at 18 months after revascularization. This study aimed to provide long-term validation and mechanistic understanding of the biomarker.

The rising burden of allergy is most evident in infancy, indicating the importance of early exposures. Reduced vitamin D status in pregnancy has been associated with atopy and respiratory outcomes, but there is less information on other early allergic outcomes.

Cord blood 25-hydroxyvitamin D₃ concentrations <50 nmol/L were highly prevalent in an Australian population. Lower vitamin D levels were associated with increased risk of eczema at 12 months of age, whereas there was no association with sensitization or food allergy. (Read the full article)

Hypovitaminosis D is common among children. Although there is prolific biochemical literature linking vitamin D to enteric immunologic function, there is a paucity of prospective data exploring the role of supplementation in prevention of diarrheal illnesses.

In a high-risk population, quarterly supplementation with 100 000 IU of vitamin D₃ did not reduce the risk for first or recurrent diarrheal illnesses in a population of children aged 1 to 29 months in a low-income inner city setting. (Read the full article)

The discovery was announced by the Minor Planet Center on Tuesday. So far, the astronomers do not have enough data to establish what the minimoon is made of.

FreeBSD Security Advisory - Due to insufficient initialization of memory copied to userland in the components listed above small amounts of kernel memory may be disclosed to userland processes. A user who can invoke 32-bit FreeBSD ioctls may be able to read the contents of small portions of kernel memory. Such memory might contain sensitive information, such as portions of the file cache or terminal buffers. This information might be directly useful, or it might be leveraged to obtain elevated privileges in some way; for example, a terminal buffer might include a user-entered password.

AN3265 - UPD301A USB Power Delivery Operation

Membrane-bound proteins have been proposed to mediate the transport of long-chain FA (LCFA) transport through the plasma membrane (PM). These proposals are based largely on reports that PM transport of LCFAs can be blocked by a number of enzymes and purported inhibitors of LCFA transport. Here, using the ratiometric pH indicator (2',7'-bis-(2-carboxyethyl)-5-(and-6-)-carboxyfluorescein and acrylodated intestinal FA-binding protein-based dual fluorescence assays, we investigated the effects of nine inhibitors of the putative FA transporter protein CD36 on the binding and transmembrane movement of LCFAs. We particularly focused on sulfosuccinimidyl oleate (SSO), reported to be a competitive inhibitor of CD36-mediated LCFA transport. Using these assays in adipocytes and inhibitor-treated protein-free lipid vesicles, we demonstrate that rapid LCFA transport across model and biological membranes remains unchanged in the presence of these purported inhibitors. We have previously shown in live cells that CD36 does not accelerate the transport of unesterified LCFAs across the PM. Our present experiments indicated disruption of LCFA metabolism inside the cell within minutes upon treatment with many of the "inhibitors" previously assumed to inhibit LCFA transport across the PM. Furthermore, using confocal microscopy and a specific anti-SSO antibody, we found that numerous intracellular and PM-bound proteins are SSO-modified in addition to CD36. Our results support the hypothesis that LCFAs diffuse rapidly across biological membranes and do not require an active protein transporter for their transmembrane movement.

Patients with hematologic cancers have improved outcomes after treatment with bispecific antibodies that bind to CD3 on T cells and that redirect T cells toward cancer cells. However, clinical benefit against solid tumors remains to be shown. We made a bispecific antibody that targets both the common prostate tumor–specific antigen PSMA and CD3 (PMSAxCD3) and provide evidence for tumor inhibition in several preclinical solid tumor models. Mice expressing the human extracellular regions of CD3 and PSMA were generated to examine antitumor efficacy in the presence of an intact immune system and PSMA expression in normal tissues. PSMAxCD3 accumulated in PSMA-expressing tissues and tumors as detected by immuno-PET imaging. Although PSMAxCD3 induced T-cell activation and showed antitumor efficacy in mice with low tumor burden, PSMAxCD3 lost efficacy against larger solid tumors, mirroring the difficulty of treating solid tumors in the clinic. Costimulatory receptors can enhance T-cell responses. We show here that costimulation can enhance the antitumor efficacy of PSMAxCD3. In particular, 4-1BB stimulation in combination with PSMAxCD3 enhanced T-cell activation and proliferation, boosted efficacy against larger tumors, and induced T-cell memory, leading to durable antitumor responses. The combination of CD3 bispecific antibodies and anti-4-1BB costimulation represents a therapeutic approach for the treatment of solid tumors.

Purpose:

Multiple myeloma (MM) patients with disease refractory to all available drugs have a poor outcome, indicating the need for new agents with novel mechanisms of action.

Purpose:

Gastrointestinal cancers remain areas of high unmet need despite advances in targeted and immunotherapies. Here, we demonstrate potent, tumor-selective efficacy with PF-07062119, a T-cell engaging CD3 bispecific targeting tumors expressing Guanylyl Cyclase C (GUCY2C), which is expressed widely across colorectal cancer and other gastrointestinal malignancies. In addition, to address immune evasion mechanisms, we explore combinations with immune checkpoint blockade agents and with antiangiogenesis therapy.

D3 is great at data visualizations, but it manipulates the DOM directly to display that data. Rendering DOM elements is where React shines. It uses a virtual representation of the DOM (virtual DOM) and a super performant diffing algorithm in order to determine the fastest way to update the DOM. We want to leverage React’s highly efficient, declarative, and reusable components with D3’s data utility functions.

At this point, we can safely say that React is the preferred JavaScript library for building user interfaces. It is used practically everywhere and is almost as pervasive as jQuery. It has an API that is simple, powerful, and easy to learn. Its performance metrics are really impressive thanks to the Virtual DOM and its clever diff algorithm between state changes. Nothing, however, is perfect, and React too has its limitations. One of React’s greatest strengths is the ease with which it integrate third-party libraries, but some libraries, especially opinionated ones, are more difficult to integrate than others.

An extremely popular library that can be tricky to integrate with React is D3.js. D3 is an excellent data visualization library with a rich and powerful API. It is the gold standard of data visualizations. However, Because this library is opinionated about data, it is no trivial endeavour to get it to work with React. A few simple strategies permit these two libraries to work together in very powerful ways.

Editor’s Note: Check out our upcoming workshop, React and D3, a crash course in learning how to create data visualizations with these two in demand libraries. Reserve your spot now on Eventbrite and get 20% off admission. Learn more at the Eventbrite page

What is React?

React is an open-source JavaScript library for creating user interfaces that addresses the challenges of building large applications with data that changes over time. Originally developed at Facebook, it is now seen in many of the most commonly used web applications including Instagram, Netflix, Airbnb, and HelloSign.

Why is React so popular?

React helps developers build applications by helping manage the application state. It’s simple, declarative, and composable. React is not a traditional MVC framework because React is really only interested in building user interfaces. Some have called it the “V(iew)” in MVC, but that’s a little misleading. React’s viewpoint is different. As application logic has reoriented toward the client, developers have applied more structure to their front-end JavaScript. We applied a paradigm that we already understood from the server (MVC) to the browser. Of course, the browser environment is very different from the server. React acknowledges that client-side applications are really a collection of UI components that should react to events like user interaction.

React encourages the building applications out of self-contained, reusable components that only care about a small piece of the UI. Other frameworks such as Angular also attempt to do this, but React stands out because it enforces a unidirectional data flow from parent component to child component. This makes debugging much easier. Debugging is the hardest part of application development, so while React is more verbose that other libraries or frameworks, in the end it saves a lot of time. In a framework like Angular’s, it can be hard to figure out where a bug is coming from: The view? The model? The controller? The directive? The directive controller? Data in Angular flows in many different directions, and this makes it hard to reason about that state of your application. In React, when there is a bug (and there will be!), you can quickly determine where the bug originated from because data only moves in one direction. Locating a bug is as simple as connecting the numbered dots until you find the culprit.

What is D3?

D3 (Data-Driven Documents) is a JavaScript library for producing dynamic, interactive data-visualizations. It’s fairly low level, and the developer has a lot of control over the end result. It takes a bit of work to get D3 to do what you want, so if you’re looking for a more prepackaged solution, you’re probably better off with highcharts.js. That said, it is fairly simple to pick up once you get the hang of it.

D3 does four main things:

1. LOADS: D3 has convenient methods for importing data from CSV documents.
2. BINDS: D3 binds data elements to the DOM via JavaScript and SVG.
3. TRANSFORMS: data can be adjusted to fit your visual requirements
4. TRANSITIONS: D3 can respond to user input and animate elements based on that input

Why Would We Want To Use React with D3?

D3 is great at data visualizations, but it manipulates the DOM directly to display that data. Rendering DOM elements is where React shines. It uses a virtual representation of the DOM (virtual DOM) and a super performant diffing algorithm in order to determine the fastest way to update the DOM. We want to leverage React’s highly efficient, declarative, and reusable components with D3’s data utility functions. Also, once we create a chart component, we can want to be able to reuse that chart with different data anywhere in our app.

How to use React and D3?

D3, like React, is declarative.D3 uses data binding, whereas React uses a unidirectional data flow paradigm. Getting these two libraries to work together takes a bit of work, but the strategy is fairly simple: since SVG lives in the DOM, let React handle displaying SVG representations of the data and lett D3 handle all the math to render the data.

Of course, we’ll have to make compromises. React is unopinionated and flexible, thereby allowing you to accomplish whatever needs to be done. Some tasks, like creating axes, are tedious. We can let D3 directly access the DOM and create. It handles axes well, and since we only need to create very few, this tactic won’t affect performance.

Let’s go through a simple example. I created a repository you can use to follow along here: playing-with-react-and-d3. You can follow in the unfinished directory and if you get stuck you can take a look at the finished directory.

Let’s generate a random list of X-Y coordinates and display them on a ScatterPlot chart. If you’re following the tutorial, a finished example is provided for you under the “finished” directory, but you can also follow along under “unfinished.” I’ve gone through the trouble of doing all the setup for you. The build will automatically be created from “unfinished/src/index.jsx”

Let’s start by creating a simple “Hello World!” React component. Create a file under “components” named “chart.jsx”

// unfinished/src/components/chart.jsx
import React from 'react';

export default (props) => {
  return <h1>Hello, World!</h1>;
}

This example is simple, but let’s go over the explanation anyway. Since we’re rendering a simple H1 with no state, we can just export a function that returns the HTML we expect. If you’re familiar with Angular or Ember, it might look weird to insert HTML directly into our JS code. On the one hand, this goes against everything we’ve learned about unobtrusive JavaScript. But on the other hand, it actually makes sense: we’re not putting JavaScript in our HTML, we’re putting our HTML into our JavaScript. React sees HTML and client-side JavaScript as fundamentally bonded together. They’re both concerned about one thing – rendering UI components to the user. They simply cannot be separated without losing the ability to see what your component is going at a glance. The great benefits of this approach is that you can describe exactly what your component will look like when it’s rendered.

Also, keep in mind that this is only possible with JSX, which translates HTML elements into React functions that will render the HTML to the page.

Now, let’s move on and mount our component to the DOM. Open up “index.jsx”

// unfinished/src/index.jsx
import './main.css';
import React    from 'react';
import ReactDOM from 'react-dom';
import Chart    from './components/chart.jsx';

const mountingPoint = document.createElement('div');
mountingPoint.className = 'react-app';
document.body.appendChild(mountingPoint);
ReactDOM.render(<Chart/>, mountingPoint);

You probably noticed a few things. You might be wondering why we’re requiring a CSS file. We’re using Webpack, which allows us to require CSS files. This is very useful when we modularize both our stylesheets and our JavaScript. We’re also creating a div in which we want to mount our React app. This is just a good practice in case you want to do other things on the page then render a React component. Lastly, we’re calling render on ReactDOM with 2 arguments, the name of the component and the DOM element we want to mount it on.

Now, let’s install all the dependencies by navigating to the unfinished directory and running npm i. Then, fire up the server with npm run start and go to localhost:8080

Awesome! We have rendered our first React component! Let’s do something a little less trivial now.

Let’s compose some functions that will create an array of random data points and then render a scatter plot. While we’re at it, we’ll add a button to randomize the dataset and trigger a re-render of our app. Let’s open up our Chart component and add the following:

// unfinished/src/components/chart.jsx
import React       from 'react';
import ScatterPlot from './scatter-plot';

const styles = {
  width   : 500,
  height  : 300,
  padding : 30,
};

// The number of data points for the chart.
const numDataPoints = 50;

// A function that returns a random number from 0 to 1000
const randomNum     = () => Math.floor(Math.random() * 1000);

// A function that creates an array of 50 elements of (x, y) coordinates.
const randomDataSet = () => {
  return Array.apply(null, {length: numDataPoints}).map(() => [randomNum(), randomNum()]);
}

export default class Chart extends React.Component{
  constructor(props) {
    super(props);
    this.state = { data: randomDataSet() };
  }

  randomizeData() {
    this.setState({ data: randomDataSet() });
  }

  render() {
    return <div>
      <h1>Playing With React and D3</h1>
      <ScatterPlot {...this.state} {...styles} />
      <div className="controls">
        <button className="btn randomize" onClick={() => this.randomizeData()}>
          Randomize Data
        </button>
      </div>
    </div>
  }
}

Since we want our component to manage it’s own state, we need to add a bit more code than was necessary for our previous “Hello World” stateless functional component. Instead of just a function, we’re going to extend React.Component and describe our component in the render() method. render() is the heart of any React component. It describes what our component is supposed to looks like. React will call render() on initial mount and on every state change.

Inside of render(), we are both rendering a scatter plot component as if it were an HTML element and setting some properties or “props”. The ... syntax is a convenient JSX and ES2015 spread operator that spreads the attributes of an array or object instead of doing all of that explicitly. For more information check out: JSX Spread Attributes. We’re going to use render() to pass our data and a style object that will be used by some of our child components.

In addition, we’re also rendering a button with an onClick event handler. We’re going to wrap this.randomizeData() with an arrow function and bind the value of this to our Chart component. When the button is clicked, randomizeData() will call this.setState() and pass in some new data.

Let’s talk about this.setState(). If render() is the heart of a React component, setState() is the brains of a component. setState explicitly tells React that we’re changing the state, thereby triggering a re-render of the component and its children. This essentially turns UI components into state machines.

Inside of setState(), we’re passing an object with data set to the randomDataSet(). This means that if we want to retrieve the state of our application, we need only call this.state.whateverStateWereLookingFor. In this case, we can retrieve the randomData by calling this.state.data.

A little side note on how React works: React offers great performance for rendering UI components by implementing a diff algorithm and comparing a virtual DOM in memory with the actual DOM. When you think about it, the DOM is really a large tree structure. If there’s one thing we have learned from decades of computer science research, it’s how to compare and manipulate trees. React takes advantage of clever tree diffing algorithms, but in order to work, each component can only render one parent element (i.e., you cannot render sibling elements). That’s why In the render function we’re wrapping all our elements in one parent div.

Let’s get started with the scatter plot component. Create a file unfinished/src/components/scatter-plot.jsx :

// unfinished/src/components/scatter-plot.jsx
import React        from 'react';
import d3           from 'd3';
import DataCircles  from './data-circles';

// Returns the largest X coordinate from the data set
const xMax   = (data)  => d3.max(data, (d) => d[0]);

// Returns the highest Y coordinate from the data set
const yMax   = (data)  => d3.max(data, (d) => d[1]);

// Returns a function that "scales" X coordinates from the data to fit the chart
const xScale = (props) => {
  return d3.scale.linear()
    .domain([0, xMax(props.data)])
    .range([props.padding, props.width - props.padding * 2]);
};

// Returns a function that "scales" Y coordinates from the data to fit the chart
const yScale = (props) => {
  return d3.scale.linear()
    .domain([0, yMax(props.data)])
    .range([props.height - props.padding, props.padding]);
};

export default (props) => {
  const scales = { xScale: xScale(props), yScale: yScale(props) };
  return <svg width={props.width} height={props.height}>
    <DataCircles {...props} {...scales} />
  </svg>
}

There’s a lot going on here, so let’s start with the stateless functional component that we’re exporting. D3 uses SVG to render data visualizations. D3 has special methods for creating SVG elements and binding data to those elements – but we’re going to let React handle that. We’re creating an SVG element with the properties passed in by the Chart component and which can be accessed via this.props. Then we’re creating a DataCircles component (more on that below) which will render the points for the scatter plot.

Let’s talk about D3 scales. This is where D3 shines. Scales takes care of the messy math involved in converting your data into a format that can be displayed on a chart. If you have a data point value 189281, but your chart is only 200 pixels wide, then D3 scales converts that value to a number you can use.

d3.scale.linear() returns a linear scale. D3 also supports other types of scales (ordinal, logarithmic, square root, etc.), but we won’t be talking about those here. domain is short for an “input domain”, i.e., the range of possible input values. It takes an array of the smallest input value possible and the maximum input value. range on its own is the range of possible output values. So in domain, we’re setting the range of possible data values from our random data, and in range we’re telling D3 the range of our chart. d3.max is a D3 method for determining the maximum value of a dataset. It can take a function which D3 will use to give the max values of the X and Y coordinates.

We use the scales to render the data circles and our axes.

Let’s create the DataCircles component under unfinished/src/components/data-circles.jsx

// unfinished/src/components/data-circles.jsx
import React from 'react';

const renderCircles = (props) => {
  return (coords, index) => {
    const circleProps = {
      cx: props.xScale(coords[0]),
      cy: props.yScale(coords[1]),
      r: 2,
      key: index
    };
    return <circle {...circleProps} />;
  };
};

export default (props) => {
  return <g>{ props.data.map(renderCircles(props)) }</g>
}

In this component, we’re rendering a g element, the SVG equivalent to a div. Since we want to render a point for every set of X-Y coordinates, were must render multiple sibling elements which we wrap together in a g element for React to work. Inside of g, we’re mapping over the data and rendering a circle for each one using renderCircles. renderCircles creates an SVG circle element with a number of properties. Here’s where we’re setting the x and y coordinates (cx and cy respectively) with the D3 scales passed in from the scatter plot component. r is the radius of our circle, and key is something React requires us to do. Since we’re rendering identical sibling components, React’s diffing algorithm needs a way to keep track of them as it updates the DOM over and over. You can use any key you like, as long as it’s unique to the list. Here we’re just going to use the index of each element.

Now, when we look at our browser, we see this:

We can see our random data and randomize that data via user input. Awesome! But we’re missing a way to read this data. What we need are axes. Let’s create them now.

Let’s open up ScatterPlot.jsx and add an XYAxis component

// unfinished/src/components/scatter-plot.jsx

// ...

import XYAxis       from './x-y-axis';

// ...

export default (props) => {
  const scales = { xScale: xScale(props), yScale: yScale(props) };
  return <svg width={props.width} height={props.height}>
    <DataCircles {...props} {...scales} />
    <XYAxis {...props} {...scales} />
  </svg>
}

Now, let’s create the XYAxis component;

// unfinished/src/components/x-y-axis.jsx
import React  from 'react';
import Axis   from './axis';

export default (props) => {
  const xSettings = {
    translate: `translate(0, ${props.height - props.padding})`,
    scale: props.xScale,
    orient: 'bottom'
  };
  const ySettings = {
    translate: `translate(${props.padding}, 0)`,
    scale: props.yScale,
    orient: 'left'
  };
  return <g className="xy-axis">
    <Axis {...xSettings}/>
    <Axis {...ySettings}/>
  </g>
}

For simplicity’s sake, we’re creating two objects which will hold the props for each of our X-Y axes. Let’s create an axis component to explain what these props do. Go ahead and create axis.jsx

// unfinished/src/components/x-y-axis.jsx
import React from 'react';
import d3    from 'd3';

export default class Axis extends React.Component {
  componentDidMount() {
    this.renderAxis();
  }

  componentDidUpdate() {
    this.renderAxis();
  }

  renderAxis() {
    var node  = this.refs.axis;
    var axis = d3.svg.axis().orient(this.props.orient).ticks(5).scale(this.props.scale);
    d3.select(node).call(axis);
  }

  render() {
    return <g className="axis" ref="axis" transform={this.props.translate}></g>
  }
}

Our strategy up to this point has been to let React exclusively handle the DOM. This is a good general rule, but we should leave room for nuance. In this case, the math and work necessary in order to render an axis is quite complicated and D3 has abstracted that pretty nicely. We’re going to let D3 have access to the DOM in this case. And since we’re only going to render a ma

Studds Shifter D3 Decor review

Panel:

• Joe Eames
• Cory House
• Aimee Knight

Special Guests: Ben Clinkinbeard

In this episode, the JavaScript Jabber panelists talk about D3.js with Ben Clinkinbeard. D3.js is a JavaScript library that has you use declarative code to tell it what you want and then it figures out all of the browser inconsistencies and creates the notes for you. He talks about the two main concepts behind D3, scales and selections, which once you understand make D3 a lot more user friendly. He then touches on SPGs and discusses his Learn D3 in 5 Days course.

In particular, we dive pretty deep on:

• What is D3.js?
• Stands for Data Driven Documents
• JavaScript
• How much of the learning curve is attributed to learning D3?
• SPG
• 2 main concepts behind D3: scales and selections
• Is learning about SPGs a prerequisite to leaning D3?
• How serious are you talking when saying idiosyncrasies?
• SPG tag
• Understanding positioning in SPG
• Positions with CSS transforms
• Are you required to use SPG?
• Not required to use SPG with D3
• Canvas
• SPG is vector based
• SPG utility function
• Responseivefy
• Learn D3 in 5 Days course
• Is there and overlap with D3 and React?
• And much, much more!

Links:

• D3.js
• JavaScript
• Responsivefy
• Learn D3 in 5 Days course
• React
• @bclinkinbeard
• Ben’s GitHub

Picks:

Cory

• React cheat sheet
• “Why software engineers disagree about everything” by Haseeb Qureshi

Joe Eames

• “JavaScript vs. TypeScript vs. ReasonML” by Dr. Axel Rauschmayer

Aimee

• “How To Use Technical Debt In Your Favor”
• Neuroscience News Twitter

Ben

• ComLink

Interview with Nima Sharifi, M.D., author of HSD3B1 Genotype and Clinical Outcomes in Metastatic Castration-Sensitive Prostate Cancer

Interview with Carlos A. Camargo, MD, author of Effect of Vitamin D₃ Supplementation on Upper Respiratory Tract Infections in Healthy Adults: The VIDARIS Randomized Controlled Trial

Interview with Mario Castro, MD, author of Effect of Vitamin D₃ on Asthma Treatment Failures in Adults With Symptomatic Asthma and Lower Vitamin D Levels