Bhasker Surnida bsurnida

A simple stacked coloumn graph built using d3's stack layout.

The SVG tooltip is based on this gist by Mike Bostock. In short, the tooltip's group, comprised of a rect and a text element, are created when the chart is first drawn and set to be hidden. Action is applied to the stacks' rects: on mouseover the group become visible; on mousemove the mouse's XY position is captured and used to transform/translate the group.

If you ajust the tooltip's XY offset, keep in mind that there can be no overlap between the group and the mouse's position or the group's visibility will remain hidden.

What's this?

Instructions to obtain ZSH on a windows environment, without the input funny business presented by some other attempted solutions.

The final result is ZSH running on a mintty terminal, emulated by cygwin, and being handled by the popular cmder.

Why is this here?

For the benefit of myself and others. I've already followed these instructions twice. It took me hours to figure all this out, maybe someone else can save a few.

What exactly is covered?

Installing and setting up cmder

Installing ChromeOS on VirtualBox

Download the NeverWare's ChromeOS build from http://www.neverware.com/freedownload
Extract the *.bin.zip
Convert it to VDI. vboxmanage convertdd chromiumos_image.bin chromiumos_image.vdi
mv chromiumis_image.vdi C:\t\v\chromeos\

Fixing our local environment with Browsersync

Whenever we change our templates we still have to use our build script and this can get annoying. Thankfully with webpack-dev-server and BrowserSync we can fix this:

npm i -D browser-sync browser-sync-webpack-plugin webpack-dev-server

BrowserSync will act like a proxy, waiting for webpack to do its thing and then reloading the browser for us.

	"use strict";

	// Load plugins
	const autoprefixer = require("autoprefixer");
	const browsersync = require("browser-sync").create();
	const cp = require("child_process");
	const cssnano = require("cssnano");
	const del = require("del");
	const eslint = require("gulp-eslint");
	const gulp = require("gulp");

	const { src, dest, watch, series } = require('gulp')

	const pug = require('gulp-pug')
	const sass = require('gulp-sass')

	const browserSync = require('browser-sync').create()


	// Compile pug files into HTML
	function html() {

	# Install chromedriver from https://sites.google.com/a/chromium.org/chromedriver/downloads

	import os

	from optparse import OptionParser

	from selenium import webdriver
	from selenium.webdriver.chrome.options import Options

	CHROME_PATH = '/usr/bin/google-chrome'

	// google_search.js
	var chromeDriver = require('chromedriver'), // Auto install ChromeDriver
	webdriver = require('selenium-webdriver'),
	By = webdriver.By,
	until = webdriver.until;

	var chrome = require("selenium-webdriver/chrome");
	var options = new chrome.Options();
	options.options_["debuggerAddress"] = "127.0.0.1:6813";
	var driver = new webdriver.Builder()

	<!DOCTYPE html>
	<head>
	<script type="text/javascript" src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js'></script>
	<script type="text/javascript" src='https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.min.js'></script>
	<script type="text/javascript" src='wordFreq.js'></script>
	</head>

	<body ng-app='wordFreqApp'>
	<div ng-controller='wordFreqCtrl'>
	<h2>Input something below</h2>