Old school D3 from simpler times

All examples By author By category About

alexhoke

Full window Github gist

Bubbles-sizes

The circles represent people per square miles for each Continent.

See (Bubble Chart)[https://github.com/phuonghuynh/bubble-chart/]

forked from phuonghuynh's block: D3 Bubble chart

forked from justlebeau's block: Continential Density Bubbles

<!DOCTYPE html>
<html>
<head>
  <title>Continental Density People/Square Mile</title>
  <meta charset="utf-8">

<link href='https://fonts.googleapis.com/css?family=Source+Sans+Pro:200,600,200italic,600italic&subset=latin,vietnamese' rel='stylesheet' type='text/css'>

<script src="https://phuonghuynh.github.io/js/bower_components/jquery/dist/jquery.min.js"></script>
  <script src="https://phuonghuynh.github.io/js/bower_components/d3/d3.min.js"></script>
  <script src="https://phuonghuynh.github.io/js/bower_components/d3-transform/src/d3-transform.js"></script>
  <script src="https://phuonghuynh.github.io/js/bower_components/cafej/src/extarray.js"></script>
  <script src="https://phuonghuynh.github.io/js/bower_components/cafej/src/misc.js"></script>
  <script src="https://phuonghuynh.github.io/js/bower_components/cafej/src/micro-observer.js"></script>
  <script src="https://phuonghuynh.github.io/js/bower_components/microplugin/src/microplugin.js"></script>
  <script src="https://phuonghuynh.github.io/js/bower_components/bubble-chart/src/bubble-chart.js"></script>
  <script src="https://phuonghuynh.github.io/js/bower_components/bubble-chart/src/plugins/central-click/central-click.js"></script>
  <script src="https://phuonghuynh.github.io/js/bower_components/bubble-chart/src/plugins/lines/lines.js"></script>
  <script src="index.js"></script>
  <style>
    .bubbleChart {
      min-width: 400px;
      max-width: 800px;
      height: 700px;
      margin: 0 auto;
    }
    .bubbleChart svg{
      background: #dbfefc;
    }
  </style>
</head>
<body style="background: #FFFFFF">
<div class="bubbleChart"/>
</body>
</html>

Modified http://phuonghuynh.github.io/js/bower_components/jquery/dist/jquery.min.js to a secure url

Modified http://phuonghuynh.github.io/js/bower_components/d3/d3.min.js to a secure url

Modified http://phuonghuynh.github.io/js/bower_components/d3-transform/src/d3-transform.js to a secure url

Modified http://phuonghuynh.github.io/js/bower_components/cafej/src/extarray.js to a secure url

Modified http://phuonghuynh.github.io/js/bower_components/cafej/src/misc.js to a secure url

Modified http://phuonghuynh.github.io/js/bower_components/cafej/src/micro-observer.js to a secure url

Modified http://phuonghuynh.github.io/js/bower_components/microplugin/src/microplugin.js to a secure url

Modified http://phuonghuynh.github.io/js/bower_components/bubble-chart/src/bubble-chart.js to a secure url

Modified http://phuonghuynh.github.io/js/bower_components/bubble-chart/src/plugins/central-click/central-click.js to a secure url

Modified http://phuonghuynh.github.io/js/bower_components/bubble-chart/src/plugins/lines/lines.js to a secure url

https://phuonghuynh.github.io/js/bower_components/jquery/dist/jquery.min.js

https://phuonghuynh.github.io/js/bower_components/d3/d3.min.js

https://phuonghuynh.github.io/js/bower_components/d3-transform/src/d3-transform.js

https://phuonghuynh.github.io/js/bower_components/cafej/src/extarray.js

https://phuonghuynh.github.io/js/bower_components/cafej/src/misc.js

https://phuonghuynh.github.io/js/bower_components/cafej/src/micro-observer.js

https://phuonghuynh.github.io/js/bower_components/microplugin/src/microplugin.js

https://phuonghuynh.github.io/js/bower_components/bubble-chart/src/bubble-chart.js

https://phuonghuynh.github.io/js/bower_components/bubble-chart/src/plugins/central-click/central-click.js

https://phuonghuynh.github.io/js/bower_components/bubble-chart/src/plugins/lines/lines.js