Nautilytics nautilytics

## d3-axis-angular.html
<svg:g class="axis--x"></svg:g>

## d3-axis.js
const xAxis = d3.select(‘svg’)
               .append(‘g’)
               .attr(‘class’, ‘axis--x’)
               .call(d3.axisBottom(xScale));

## d3-transition-react.js
import {select as d3_select} from 'd3-selection';
...
const markerRef = useRef();

useEffect(() => {
 d3_select(markerRef.current)
  .transition()
  .duration(1000)
  .attr('cx', item.x)
  .attr('cy', item.y);

## d3-transition.js
const markers = d3.selectAll(‘.marker’)
                  .data(data, d => d.id)
                  .enter()
                  .append(‘circle’)
                  .attr(‘class’, ‘marker’)
                  .attr(‘r’, 7.5)
                  .transition()
                  .duration(1000)
                  .attr(‘cx’, d => d.x)
                  .attr(‘cy’, d => d.y);

## d3-transition-angular.html
<svg:circle [attr.r.px]="item.r"
           [ngClass]="'marker'"
           [appSvgTransition]="transition"
           [d3-attr]="{cx: item.x, cy: item.y}">
</svg:circle>

## d3-quadtree-search.js
import {quadtree as d3_quadtree} from "d3-quadtree";
import {search} from "search.js";

// ...

// Create cluster points, i.e. an array of:
// [[cluster_x, cluster_y, [points_to_cluster], ...]
const nodes = [[0, 0, {id: 1, r: 10, name: "node-1"}], [10, 10, {id: 2, r: 10, name: "node-2"}]];
const clusterRange = 80;
const quadtree = d3_quadtree().addAll(nodes);

## d3-force-layout.js
const calculateLayout = (items, spacing = 0.01) => {
  // Calculate a force directed placement for each point
  const MAX_STEPS = 300,
    STRENGTH = 10,
    ALPHA = 0.3;

  if (!items.length) return [];

  const getY = d => d.y;
  const getX = d => d.x;

## area-chart-mask.html
<svg width="100%" height="100%">
  <defs>
    <mask
      id='mask-for-area-chart'
      maskUnits="userSpaceOnUse"
      maskContentUnits="userSpaceOnUse">
      <path d="M0Z" style="fill: white;">
      </path>
      </g>
    </mask>

## UK.json

      
              3 files
            
          
              0 forks
            
          
              0 comments
            
          
              1 star
            
          
                nautilytics
                / UK.json
            
            
              Last active
              January 12, 2021 17:05
            
              
                A GeoJSON to PNG converter using D3 for Node
              
          
      Sorry, something went wrong. Reload?
      Sorry, we cannot display this file.
      Sorry, this file is invalid so it cannot be displayed.
      
          Viewer requires iframe.
      
    
## deploy_staging.yml
name: Deploy Staging Branch

on:
  push:
    branches:
      - master

jobs:
  build:
    runs-on: ubuntu-latest
	const xAxis = d3.select(‘svg’)
	.append(‘g’)
	.attr(‘class’, ‘axis--x’)
	.call(d3.axisBottom(xScale));
	import {select as d3_select} from 'd3-selection';
	...
	const markerRef = useRef();

	useEffect(() => {
	d3_select(markerRef.current)
	.transition()
	.duration(1000)
	.attr('cx', item.x)
	.attr('cy', item.y);
	const markers = d3.selectAll(‘.marker’)
	.data(data, d => d.id)
	.enter()
	.append(‘circle’)
	.attr(‘class’, ‘marker’)
	.attr(‘r’, 7.5)
	.transition()
	.duration(1000)
	.attr(‘cx’, d => d.x)
	.attr(‘cy’, d => d.y);
	<svg:circle [attr.r.px]="item.r"
	[ngClass]="'marker'"
	[appSvgTransition]="transition"
	[d3-attr]="{cx: item.x, cy: item.y}">
	</svg:circle>
	import {quadtree as d3_quadtree} from "d3-quadtree";
	import {search} from "search.js";

	// ...

	// Create cluster points, i.e. an array of:
	// [[cluster_x, cluster_y, [points_to_cluster], ...]
	const nodes = [[0, 0, {id: 1, r: 10, name: "node-1"}], [10, 10, {id: 2, r: 10, name: "node-2"}]];
	const clusterRange = 80;
	const quadtree = d3_quadtree().addAll(nodes);
	const calculateLayout = (items, spacing = 0.01) => {
	// Calculate a force directed placement for each point
	const MAX_STEPS = 300,
	STRENGTH = 10,
	ALPHA = 0.3;

	if (!items.length) return [];

	const getY = d => d.y;
	const getX = d => d.x;
	<svg width="100%" height="100%">
	<defs>
	<mask
	id='mask-for-area-chart'
	maskUnits="userSpaceOnUse"
	maskContentUnits="userSpaceOnUse">
	<path d="M0Z" style="fill: white;">
	</path>
	</g>
	</mask>
	name: Deploy Staging Branch

	on:
	push:
	branches:
	- master

	jobs:
	build:
	runs-on: ubuntu-latest