Anthony Ng ng-the-engineer

2 followers · 2 following

https://anthony.ng

View GitHub Profile

Recently created

Least recently created

Recently updated

Least recently updated

ng-the-engineer / plot.js

Created May 18, 2021 12:02

Code snippet of tutorial bubble plot

	svg
	.append("text")
	.attr("x", 230)
	.attr("y", 420)
	.style("text-anchor", "middle")
	.text("Last used year");

	svg
	.append("text")
	.attr("x", -200)

ng-the-engineer / plot.js

Last active May 21, 2021 10:38

Code snippet of tutorial bubble plot

	const margin = { top: 10, right: 20, bottom: 30, left: 50 };
	const width = 500 - margin.left - margin.right;
	const height = 420 - margin.top - margin.bottom;
	const xLabelHeight = 50;

	d3.csv("https://tutorial-node-api-k8s-ng-the-engineer.cloud.okteto.net/skills", (data) => {
	...
	}
	);

ng-the-engineer / index.html

Last active May 21, 2021 09:55

Code snippet of tutorial bubble plot

	<!DOCTYPE html>
	<head>
	<meta charset="utf-8" />
	<script
	src="https://cdnjs.cloudflare.com/ajax/libs/d3/6.7.0/d3.min.js"
	integrity="sha512-cd6CHE+XWDQ33ElJqsi0MdNte3S+bQY819f7p3NUHgwQQLXSKjE4cPZTeGNI+vaxZynk1wVU3hoHmow3m089wA=="
	crossorigin="anonymous"
	referrerpolicy="no-referrer"
	></script>
	<script src="https://d3js.org/d3-scale-chromatic.v1.min.js"></script>

ng-the-engineer / plot.js

Last active May 17, 2021 18:07

Code snippet of tutorial bubble plot

	svg
	.append("g")
	.selectAll("dot")
	.data(data)
	.enter()
	.attr("class", "bubbles")
	.attr("cx", (d) => x(d.lastUse))
	.attr("cy", (d) => y(d.exp))
	.attr("r", (d) => z(d.competency ** 3 / 100))
	.style("fill", (d) => myColor(d.category))

ng-the-engineer / plot.js

Created May 17, 2021 17:59

Code snippet of tutorial bubble plot

	const showTooltip = function (d) {
	tooltip.transition().duration(200);
	tooltip
	.style("opacity", 1)
	.html(d.skill)
	.style("left", d3.mouse(this)[0] + 30 + "px")
	.style("top", d3.mouse(this)[1] + 30 + "px");
	};

	const moveTooltip = function (d) {

ng-the-engineer / plot.js

Created May 17, 2021 17:56

Code snippet of tutorial bubble plot

	const tooltip = d3
	.select("#skills_bubble_plot")
	.append("div")
	.style("position", "absolute")
	.style("opacity", 0)
	.style("background-color", "black")
	.style("border-radius", "5px")
	.style("padding", "10px")
	.style("color", "white");

ng-the-engineer / plot.js

Last active May 17, 2021 15:34

Code snippet of tutorial bubble plot

	var myColor = d3
	.scaleOrdinal()
	.domain([
	"Javascript",
	"Frontend",
	"Backend",
	"Testing",
	"Database",
	"Programming Language",
	"Version Control",

ng-the-engineer / deployment.yaml

Created May 4, 2021 19:39

Code snippet of tutorial node api k8s

	apiVersion: apps/v1
	kind: Deployment
	metadata:
	name: tutorial-node-api-k8s
	spec:
	replicas: 2
	selector:
	matchLabels:
	name: tutorial-node-api-k8s
	template:

ng-the-engineer / okteto-pipeline.yaml

Created May 4, 2021 16:21

Code snippet of tutorial node api k8s

	deploy:
	- okteto build -t okteto.dev/tutorial-node-api-k8s:latest
	- kubectl apply -f k8s

ng-the-engineer / service.yaml

Created May 4, 2021 16:10

Code snippet of tutorial node api k8s

	apiVersion: v1
	kind: Service
	metadata:
	name: tutorial-node-api-k8s
	labels:
	name: tutorial-node-api-k8s
	annotations:
	dev.okteto.com/auto-ingress: "true"
	spec:
	type: ClusterIP