Update site
This commit is contained in:
Brandon Tilley
parent
2a20817f82
commit
4b9efea134
@ -45,6 +45,10 @@
|
||||
Introduction
|
||||
<i class='icon home'></i>
|
||||
</a>
|
||||
<a class='purple item ' href='/documentation/installation.html'>
|
||||
Installation
|
||||
<i class='icon download'></i>
|
||||
</a>
|
||||
<a class='blue item ' href='/documentation/core.html'>
|
||||
Core API
|
||||
<i class='icon setting'></i>
|
||||
|
||||
@ -45,6 +45,10 @@
|
||||
Introduction
|
||||
<i class='icon home'></i>
|
||||
</a>
|
||||
<a class='purple item ' href='/documentation/installation.html'>
|
||||
Installation
|
||||
<i class='icon download'></i>
|
||||
</a>
|
||||
<a class='blue item ' href='/documentation/core.html'>
|
||||
Core API
|
||||
<i class='icon setting'></i>
|
||||
|
||||
@ -45,6 +45,10 @@
|
||||
Introduction
|
||||
<i class='icon home'></i>
|
||||
</a>
|
||||
<a class='purple item ' href='/documentation/installation.html'>
|
||||
Installation
|
||||
<i class='icon download'></i>
|
||||
</a>
|
||||
<a class='blue item ' href='/documentation/core.html'>
|
||||
Core API
|
||||
<i class='icon setting'></i>
|
||||
|
||||
@ -45,6 +45,10 @@
|
||||
Introduction
|
||||
<i class='icon home'></i>
|
||||
</a>
|
||||
<a class='purple item ' href='/documentation/installation.html'>
|
||||
Installation
|
||||
<i class='icon download'></i>
|
||||
</a>
|
||||
<a class='blue item ' href='/documentation/core.html'>
|
||||
Core API
|
||||
<i class='icon setting'></i>
|
||||
|
||||
@ -45,6 +45,10 @@
|
||||
Introduction
|
||||
<i class='icon home'></i>
|
||||
</a>
|
||||
<a class='purple item ' href='/documentation/installation.html'>
|
||||
Installation
|
||||
<i class='icon download'></i>
|
||||
</a>
|
||||
<a class='blue item ' href='/documentation/core.html'>
|
||||
Core API
|
||||
<i class='icon setting'></i>
|
||||
|
||||
@ -45,6 +45,10 @@
|
||||
Introduction
|
||||
<i class='icon home'></i>
|
||||
</a>
|
||||
<a class='purple item ' href='/documentation/installation.html'>
|
||||
Installation
|
||||
<i class='icon download'></i>
|
||||
</a>
|
||||
<a class='blue item ' href='/documentation/core.html'>
|
||||
Core API
|
||||
<i class='icon setting'></i>
|
||||
|
||||
@ -45,6 +45,10 @@
|
||||
Introduction
|
||||
<i class='icon home'></i>
|
||||
</a>
|
||||
<a class='purple item ' href='/documentation/installation.html'>
|
||||
Installation
|
||||
<i class='icon download'></i>
|
||||
</a>
|
||||
<a class='blue item ' href='/documentation/core.html'>
|
||||
Core API
|
||||
<i class='icon setting'></i>
|
||||
|
||||
@ -45,6 +45,10 @@
|
||||
Introduction
|
||||
<i class='icon home'></i>
|
||||
</a>
|
||||
<a class='purple item ' href='/documentation/installation.html'>
|
||||
Installation
|
||||
<i class='icon download'></i>
|
||||
</a>
|
||||
<a class='blue item ' href='/documentation/core.html'>
|
||||
Core API
|
||||
<i class='icon setting'></i>
|
||||
|
||||
@ -45,6 +45,10 @@
|
||||
Introduction
|
||||
<i class='icon home'></i>
|
||||
</a>
|
||||
<a class='purple item ' href='/documentation/installation.html'>
|
||||
Installation
|
||||
<i class='icon download'></i>
|
||||
</a>
|
||||
<a class='blue item ' href='/documentation/core.html'>
|
||||
Core API
|
||||
<i class='icon setting'></i>
|
||||
|
||||
@ -45,6 +45,10 @@
|
||||
Introduction
|
||||
<i class='icon home'></i>
|
||||
</a>
|
||||
<a class='purple item ' href='/documentation/installation.html'>
|
||||
Installation
|
||||
<i class='icon download'></i>
|
||||
</a>
|
||||
<a class='blue item active' href='/documentation/core.html'>
|
||||
Core API
|
||||
<i class='icon setting'></i>
|
||||
@ -86,21 +90,6 @@
|
||||
|
||||
<div class='twelve wide column'>
|
||||
<h1>Core API</h1>
|
||||
<h2>Installation</h2>
|
||||
<p>Once you've <a href="/download/">downloaded Planetary.js</a>, you can include it via a <code>script</code> tag on your page <em>after</em> the inclusion of D3 and TopoJSON. This example uses the CDN URLs for those libraries:</p>
|
||||
<div class='ui raised segment'>
|
||||
<div class='ui blue ribbon label'>HTML</div>
|
||||
|
||||
<pre><code class="language-html"><html>
|
||||
<head>
|
||||
<script type='text/javascript' src='http://d3js.org/d3.v3.min.js'></script>
|
||||
<script type='text/javascript' src='http://d3js.org/topojson.v1.min.js'></script>
|
||||
<script type='text/javascript' src='path/to/planetaryjs.min.js'></script>
|
||||
</head>
|
||||
<body>
|
||||
...</code></pre>
|
||||
<p></div></p>
|
||||
<p>If you use the default <code>topojson</code> plugin (most people will), you'll also need to make sure <code>world-110m.json</code> (or some other TopoJSON data file) is available on your server. This file is also available from <a href="/download/">the download page</a>. See the <a href="/documentation/builtin_topojson.html">TopoJSON Plugin documentation</a> for more information.</p>
|
||||
<h2>Core API</h2>
|
||||
<p><strong><code>planetaryjs.noConflict()</code></strong></p>
|
||||
<p>In non-AMD and non-CommonJS environments, Planetary.js takes over the global <code>planetaryjs</code> namespace (in the browser, this means <code>window.planetaryjs</code>). If, for some reason, something else useful was there before you loaded Planetary.js, you can ask for it to be returned to that spot by calling <code>planetaryjs.noConflict()</code>. The Planetary.js library will be returned from the function, so you can continue to use the library.</p>
|
||||
|
||||
@ -45,6 +45,10 @@
|
||||
Introduction
|
||||
<i class='icon home'></i>
|
||||
</a>
|
||||
<a class='purple item ' href='/documentation/installation.html'>
|
||||
Installation
|
||||
<i class='icon download'></i>
|
||||
</a>
|
||||
<a class='blue item ' href='/documentation/core.html'>
|
||||
Core API
|
||||
<i class='icon setting'></i>
|
||||
@ -119,43 +123,6 @@ planet's <code>draw</code> method.</p>
|
||||
|
||||
<p><strong>Q:</strong> I'm getting "Cannot read property 'geo' of undefined" or "Cannot call method 'feature' of undefined."</p>
|
||||
<p><strong>A:</strong> Ensure you're requiring the <a href="http://d3js.org/">D3</a> and <a href="https://github.com/mbostock/topojson">TopoJSON</a> libraries before Planetary.js.</p>
|
||||
<div class="ui horizontal icon divider">
|
||||
<i class="globe icon"></i>
|
||||
</div>
|
||||
|
||||
<p><strong>Q:</strong> Can I use Planetary.js with AMD or CommonJS?</p>
|
||||
<p><strong>A:</strong> Yes and no. Planetary.js uses a universal module definition, and so is compatible with AMD and CommonJS. However, neither D3 nor TopoJSON support AMD, and TopoJSON's CommonJS package (as installed with <a href="https://npmjs.org/">npm</a>) uses Node-specific functionality, so you can't, for instance, <a href="http://browserify.org/">browserify</a> it directly.</p>
|
||||
<h2>AMD</h2>
|
||||
<p>This example uses <a href="http://requirejs.org/">RequireJS</a>. Since neither D3 nor TopoJSON support AMD, we will use RequireJS's <a href="http://requirejs.org/docs/api.html#config-shim">shim configuration</a>.</p>
|
||||
<div class='ui raised segment'>
|
||||
<div class='ui blue ribbon label'>HTML</div>
|
||||
|
||||
<pre><code class="language-html"><body>
|
||||
<canvas id='globe' width='500' height='500'></canavs>
|
||||
<script src='//cdnjs.cloudflare.com/ajax/libs/require.js/2.1.9/require.min.js'
|
||||
data-main='/app.js'></script>
|
||||
</body></code></pre>
|
||||
<div class='ui red ribbon label'>JavaScript</div>
|
||||
|
||||
<pre><code class="language-javascript">requirejs.config({
|
||||
// Tell RequireJS to use `window.d3` and `window.topojson`
|
||||
// for those libraries, respectively
|
||||
shim: {
|
||||
d3: { exports: 'd3' },
|
||||
topojson: { exports: 'topojson' }
|
||||
},
|
||||
paths: {
|
||||
'd3': 'path/to/d3.v3.min',
|
||||
'topojson': 'path/to/topojson.v1.min'
|
||||
}
|
||||
});
|
||||
|
||||
requirejs(['planetaryjs'], function(planetaryjs) {
|
||||
// Use Planetary.js here
|
||||
});</code></pre>
|
||||
<p></div></p>
|
||||
<h2>CommonJS</h2>
|
||||
<p>To use Planetary.js with a tool like Browserify, you will need to create a shim for TopoJSON (D3 includes a Browserify-compatible script). Take a look at <a href="https://github.com/thlorenz/browserify-shim">browserify-shim</a> for more information.</p>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -45,6 +45,10 @@
|
||||
Introduction
|
||||
<i class='icon home'></i>
|
||||
</a>
|
||||
<a class='purple item ' href='/documentation/installation.html'>
|
||||
Installation
|
||||
<i class='icon download'></i>
|
||||
</a>
|
||||
<a class='blue item ' href='/documentation/core.html'>
|
||||
Core API
|
||||
<i class='icon setting'></i>
|
||||
|
||||
@ -45,6 +45,10 @@
|
||||
Introduction
|
||||
<i class='icon home'></i>
|
||||
</a>
|
||||
<a class='purple item ' href='/documentation/installation.html'>
|
||||
Installation
|
||||
<i class='icon download'></i>
|
||||
</a>
|
||||
<a class='blue item ' href='/documentation/core.html'>
|
||||
Core API
|
||||
<i class='icon setting'></i>
|
||||
@ -97,7 +101,7 @@
|
||||
<li><a href="/documentation/help.html">Getting Help</a> describes what to do if you still need help after reading this documentation.</li>
|
||||
</ul>
|
||||
<h2>Quick Start</h2>
|
||||
<p>If you want to get up-and-running quickly, or like to experiment and figure things out, you can use this HTML and JavaScript to get a very simple globe up and running.</p>
|
||||
<p>If you want to get up-and-running quickly, or like to experiment and figure things out, you can use this HTML and JavaScript to get a very simple globe up and running (once you've <a href="/documentation/installation.html">installed Planetary.js</a>).</p>
|
||||
<p>Note that you'll need to run this page from a web server of some kind so that Planetary.js can load the TopoJSON data via Ajax (Ajax requests don't work when viewing a page directly from the filesystem).</p>
|
||||
<p>Be sure to check out <a href="/examples/">the examples</a> as well!</p>
|
||||
<div class='ui raised segment'>
|
||||
|
||||
173
documentation/installation.html
Normal file
173
documentation/installation.html
Normal file
@ -0,0 +1,173 @@
|
||||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Planetary.js: Awesome interactive globes for the web</title>
|
||||
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700|Open+Sans:300italic,400,300,700' rel='stylesheet' type='text/css'>
|
||||
<link type="text/css" rel="stylesheet" href="/semantic/css/semantic.min.css">
|
||||
<link type="text/css" rel="stylesheet" href="/css/planetaryjs.css">
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">
|
||||
<meta property="og:image" content="http://planetaryjs.com/images/ex-rotating.png">
|
||||
<meta property="og:site_name" content="Planetary.js">
|
||||
|
||||
<link href="/css/prism.css" rel="stylesheet">
|
||||
</head>
|
||||
<body>
|
||||
<div class='ui fixed inverted large menu main-menu'>
|
||||
<div class='items'>
|
||||
<a class='item title' href='/'>
|
||||
<i class='globe icon'></i>Planetary.js
|
||||
</a>
|
||||
<span class='spacer hide-on-mobile'></span>
|
||||
<a class='item minor ' href='/download/'>
|
||||
<i class='download icon'></i><span class='hide-on-mobile'>Download</span>
|
||||
</a>
|
||||
<a class='item minor ' href='/examples/'>
|
||||
<i class='laptop icon'></i><span class='hide-on-mobile'>Examples</span>
|
||||
</a>
|
||||
<a class='item minor active' href='/documentation/'>
|
||||
<i class='book icon'></i><span class='hide-on-mobile'>Documentation</span>
|
||||
</a>
|
||||
<a class='item minor' href='https://github.com/BinaryMuse/planetary.js'>
|
||||
<i class='github alternate icon'></i><span class='hide-on-mobile'>Fork on GitHub</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class='content container'>
|
||||
<div class='page ui slim stackable grid'>
|
||||
<div class='four wide column'>
|
||||
<div class='ui fluid vertical menu'>
|
||||
<a class='red item ' href='/documentation/index.html'>
|
||||
Introduction
|
||||
<i class='icon home'></i>
|
||||
</a>
|
||||
<a class='purple item active' href='/documentation/installation.html'>
|
||||
Installation
|
||||
<i class='icon download'></i>
|
||||
</a>
|
||||
<a class='blue item ' href='/documentation/core.html'>
|
||||
Core API
|
||||
<i class='icon setting'></i>
|
||||
</a>
|
||||
<a class='orange item ' href='/documentation/planet.html'>
|
||||
Planet API
|
||||
<i class='icon globe'></i>
|
||||
</a>
|
||||
<a class='teal item ' href='/documentation/plugins.html'>
|
||||
Plugins
|
||||
<i class='icon edit'></i>
|
||||
</a>
|
||||
<a class='purple item with-subitems ' href='/documentation/builtin.html'>
|
||||
Built-In Plugins
|
||||
<i class='icon bolt'></i>
|
||||
</a>
|
||||
<div class='item contains-subitems'>
|
||||
<div class='menu'>
|
||||
<a class='item ' href='/documentation/builtin_earth.html'>Earth</a>
|
||||
<a class='item ' href='/documentation/builtin_topojson.html'>TopoJSON</a>
|
||||
<a class='item ' href='/documentation/builtin_oceans.html'>Oceans</a>
|
||||
<a class='item ' href='/documentation/builtin_land.html'>Land</a>
|
||||
<a class='item ' href='/documentation/builtin_borders.html'>Borders</a>
|
||||
<a class='item ' href='/documentation/builtin_pings.html'>Pings</a>
|
||||
<a class='item ' href='/documentation/builtin_zoom.html'>Zoom</a>
|
||||
<a class='item ' href='/documentation/builtin_drag.html'>Drag</a>
|
||||
</div>
|
||||
</div>
|
||||
<a class='red item ' href='/documentation/faq.html'>
|
||||
FAQ
|
||||
<i class='icon help'></i>
|
||||
</a>
|
||||
<a class='green item ' href='/documentation/help.html'>
|
||||
Getting Help
|
||||
<i class='icon phone'></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class='twelve wide column'>
|
||||
<h1>Installation</h1>
|
||||
<p>Once you've <a href="/download/">downloaded Planetary.js</a>, you can include it via a <code>script</code> tag on your page <em>after</em> the inclusion of D3 and TopoJSON. This example uses the CDN URLs for those libraries:</p>
|
||||
<div class='ui raised segment'>
|
||||
<div class='ui blue ribbon label'>HTML</div>
|
||||
|
||||
<pre><code class="language-html"><html>
|
||||
<head>
|
||||
<script type='text/javascript' src='http://d3js.org/d3.v3.min.js'></script>
|
||||
<script type='text/javascript' src='http://d3js.org/topojson.v1.min.js'></script>
|
||||
<script type='text/javascript' src='path/to/planetaryjs.min.js'></script>
|
||||
</head>
|
||||
<body>
|
||||
...</code></pre>
|
||||
<p></div></p>
|
||||
<p>If you use the default <code>topojson</code> plugin (most people will), you'll also need to make sure <code>world-110m.json</code> (or some other TopoJSON data file) is available on your server. This file is also available from <a href="/download/">the download page</a>. See the <a href="/documentation/builtin_topojson.html">TopoJSON Plugin documentation</a> for more information.</p>
|
||||
<p>Planetary.js also supports installation via AMD and CommonJS loaders.</p>
|
||||
<h2>AMD</h2>
|
||||
<p>This example uses <a href="http://requirejs.org/">RequireJS</a>. Since neither D3 nor TopoJSON support AMD, we will use RequireJS's <a href="http://requirejs.org/docs/api.html#config-shim">shim configuration</a>.</p>
|
||||
<div class='ui raised segment'>
|
||||
<div class='ui blue ribbon label'>HTML</div>
|
||||
|
||||
<pre><code class="language-html"><body>
|
||||
<canvas id='globe' width='500' height='500'></canavs>
|
||||
<script src='//cdnjs.cloudflare.com/ajax/libs/require.js/2.1.9/require.min.js'
|
||||
data-main='/app.js'></script>
|
||||
</body></code></pre>
|
||||
<div class='ui red ribbon label'>JavaScript</div>
|
||||
|
||||
<pre><code class="language-javascript">requirejs.config({
|
||||
// Tell RequireJS to use `window.d3` and `window.topojson`
|
||||
// for those libraries, respectively
|
||||
shim: {
|
||||
d3: { exports: 'd3' },
|
||||
topojson: { exports: 'topojson' }
|
||||
},
|
||||
paths: {
|
||||
'd3': 'path/to/d3.v3.min',
|
||||
'topojson': 'path/to/topojson.v1.min'
|
||||
}
|
||||
});
|
||||
|
||||
requirejs(['planetaryjs'], function(planetaryjs) {
|
||||
// Use Planetary.js here
|
||||
});</code></pre>
|
||||
<p></div></p>
|
||||
<h2>CommonJS</h2>
|
||||
<div class='ui red raised segment'>
|
||||
There is <a href="https://github.com/mbostock/topojson/pull/129">a pull request</a> open on the TopoJSON project to make this process more intuitive; these instructions will be updated based on its acceptance.
|
||||
</div>
|
||||
|
||||
<p>First, install <code>browserify</code> and <code>brfs</code> from npm (as well as <code>planetary.js</code>, if you haven't already). Then, create your application (here referred to as <code>app.js</code>) and bundle it with browserify, running the dependencies through brfs.</p>
|
||||
<div class='ui raised segment'>
|
||||
<div class='ui red ribbon label'>JavaScript</div>
|
||||
|
||||
<pre><code class="language-javascript">var planetaryjs = require('planetary.js');
|
||||
|
||||
var planet = planetaryjs.planet();
|
||||
var canvas = document.getElementById('canvas');
|
||||
planet.draw(canvas);</code></pre>
|
||||
<div class='ui purple ribbon label'>Shell</div>
|
||||
|
||||
<pre><code class="language-shell">$ npm install browserify brfs
|
||||
$ ./node_modules/.bin/browserify --g brfs app.js > bundle.js</code></pre>
|
||||
<p></div></p>
|
||||
<p><code>bundle.js</code> is now ready to use!</p>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script type='text/javascript' src='/js/prism.js'></script>
|
||||
<script>
|
||||
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
||||
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
|
||||
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
|
||||
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
|
||||
|
||||
ga('create', 'UA-46705270-1', 'planetaryjs.com');
|
||||
ga('send', 'pageview');
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -45,6 +45,10 @@
|
||||
Introduction
|
||||
<i class='icon home'></i>
|
||||
</a>
|
||||
<a class='purple item ' href='/documentation/installation.html'>
|
||||
Installation
|
||||
<i class='icon download'></i>
|
||||
</a>
|
||||
<a class='blue item ' href='/documentation/core.html'>
|
||||
Core API
|
||||
<i class='icon setting'></i>
|
||||
|
||||
@ -45,6 +45,10 @@
|
||||
Introduction
|
||||
<i class='icon home'></i>
|
||||
</a>
|
||||
<a class='purple item ' href='/documentation/installation.html'>
|
||||
Installation
|
||||
<i class='icon download'></i>
|
||||
</a>
|
||||
<a class='blue item ' href='/documentation/core.html'>
|
||||
Core API
|
||||
<i class='icon setting'></i>
|
||||
|
||||
@ -55,40 +55,40 @@
|
||||
|
||||
|
||||
|
||||
<h2>Latest Stable Build: v1.0.0</h2>
|
||||
<p><a href="https://github.com/BinaryMuse/planetary.js/releases/tag/v1.0.0">Release notes</a>
|
||||
<h2>Latest Stable Build: v1.0.1</h2>
|
||||
<p><a href="https://github.com/BinaryMuse/planetary.js/releases/tag/v1.0.1">Release notes</a>
|
||||
|
|
||||
<a href="https://github.com/BinaryMuse/planetary.js/tree/v1.0.0">GitHub tag</a></p>
|
||||
<a href="https://github.com/BinaryMuse/planetary.js/tree/v1.0.1">GitHub tag</a></p>
|
||||
|
||||
<div class='ui list download-list'>
|
||||
<div class='item'>
|
||||
<i class='icon download'></i>
|
||||
Core library: [
|
||||
<a href='https://github.com/BinaryMuse/planetary.js/releases/download/v1.0.0/planetaryjs.min.js'>minified</a>
|
||||
<a href='https://github.com/BinaryMuse/planetary.js/releases/download/v1.0.1/planetaryjs.min.js'>minified</a>
|
||||
|
|
||||
<a href='https://github.com/BinaryMuse/planetary.js/releases/download/v1.0.0/planetaryjs.js'>unminified</a>
|
||||
<a href='https://github.com/BinaryMuse/planetary.js/releases/download/v1.0.1/planetaryjs.js'>unminified</a>
|
||||
]
|
||||
</div>
|
||||
<div class='item'>
|
||||
<i class='icon download'></i>
|
||||
Core library (no plugins): [
|
||||
<a href='https://github.com/BinaryMuse/planetary.js/releases/download/v1.0.0/planetaryjs-noplugins.min.js'>minified</a>
|
||||
<a href='https://github.com/BinaryMuse/planetary.js/releases/download/v1.0.1/planetaryjs-noplugins.min.js'>minified</a>
|
||||
|
|
||||
<a href='https://github.com/BinaryMuse/planetary.js/releases/download/v1.0.0/planetaryjs-noplugins.js'>unminified</a>
|
||||
<a href='https://github.com/BinaryMuse/planetary.js/releases/download/v1.0.1/planetaryjs-noplugins.js'>unminified</a>
|
||||
]
|
||||
</div>
|
||||
<div class='item'>
|
||||
<i class='icon globe'></i>
|
||||
Earth TopoJSON data ("land" and "countries" objects): [
|
||||
<a href='https://github.com/BinaryMuse/planetary.js/releases/download/v1.0.0/world-110m.json'>download</a>
|
||||
<a href='https://github.com/BinaryMuse/planetary.js/releases/download/v1.0.1/world-110m.json'>download</a>
|
||||
]
|
||||
</div>
|
||||
<div class='item'>
|
||||
<i class='icon code'></i>
|
||||
Source code [
|
||||
<a href='https://github.com/BinaryMuse/planetary.js/archive/v1.0.0.zip'>.zip</a>
|
||||
<a href='https://github.com/BinaryMuse/planetary.js/archive/v1.0.1.zip'>.zip</a>
|
||||
|
|
||||
<a href='https://github.com/BinaryMuse/planetary.js/archive/v1.0.0.tar.gz'>.tar.gz</a>
|
||||
<a href='https://github.com/BinaryMuse/planetary.js/archive/v1.0.1.tar.gz'>.tar.gz</a>
|
||||
]
|
||||
</div>
|
||||
</div>
|
||||
|
||||
2
js/lib/planetaryjs.min.js
vendored
2
js/lib/planetaryjs.min.js
vendored
@ -1,2 +1,2 @@
|
||||
/*! Planetary.js 1.0.0 | (c) 2013 Brandon Tilley | Released under MIT License */
|
||||
/*! Planetary.js 1.0.1 | (c) 2013 Brandon Tilley | Released under MIT License */
|
||||
!function(n,t){"function"==typeof define&&define.amd?define(["d3","topojson"],t):"object"==typeof exports?module.exports=t(require("d3"),require("topojson")):n.planetaryjs=t(n.d3,n.topojson,n)}(this,function(n,t,o){"use strict";var i=null;o&&(i=o.planetaryjs);var e=[],r=function(t,o,i){n.timer(function(){t.context.clearRect(0,0,o.width,o.height);for(var n=0;n<i.onDraw.length;n++)i.onDraw[n]()})},l=function(n,t){for(var o=e.length-1;o>=0;o--)t.unshift(e[o]);for(0===t.length&&(u.plugins.earth&&n.loadPlugin(u.plugins.earth()),u.plugins.pings&&n.loadPlugin(u.plugins.pings())),o=0;o<t.length;o++)t[o](n)},a=function(n,t,o){if(o.onInit.length){var i=0,e=function(n){var t=o.onInit[i];t.length?t(function(){i++,n()}):(t(),i++,setTimeout(n,0))},l=function(){i>=o.onInit.length?r(n,t,o):e(l)};e(l)}else r(n,t,o)},c=function(n,t,o,i){l(n,o),n.canvas=t,n.context=t.getContext("2d"),a(n,t,i)},u={plugins:{},noConflict:function(){return o.planetaryjs=i,u},loadPlugin:function(n){e.push(n)},planet:function(){var t=[],o={onInit:[],onDraw:[]},i={plugins:{},draw:function(n){c(i,n,t,o)},onInit:function(n){o.onInit.push(n)},onDraw:function(n){o.onDraw.push(n)},loadPlugin:function(n){t.push(n)},withSavedContext:function(n){if(!this.context)throw new Error("No canvas to fetch context for");this.context.save(),n(this.context),this.context.restore()}};return i.projection=n.geo.orthographic().clipAngle(90).precision(0),i.path=n.geo.path().projection(i.projection),i}};return u.plugins.topojson=function(t){return function(o){o.plugins.topojson={},o.onInit(function(i){if(t.world)o.plugins.topojson.world=t.world,setTimeout(i,0);else{var e=t.file||"world-110m.json";n.json(e,function(n,t){if(n)throw new Error("Could not load JSON "+e);o.plugins.topojson.world=t,i()})}})}},u.plugins.oceans=function(n){return function(t){t.onDraw(function(){t.withSavedContext(function(o){o.beginPath(),t.path.context(o)({type:"Sphere"}),o.fillStyle=n.fill||"black",o.fill()})})}},u.plugins.land=function(n){return function(o){var i=null;o.onInit(function(){var n=o.plugins.topojson.world;i=t.feature(n,n.objects.land)}),o.onDraw(function(){o.withSavedContext(function(t){t.beginPath(),o.path.context(t)(i),n.fill!==!1&&(t.fillStyle=n.fill||"white",t.fill()),n.stroke&&(n.lineWidth&&(t.lineWidth=n.lineWidth),t.strokeStyle=n.stroke,t.stroke())})})}},u.plugins.borders=function(n){return function(o){var i=null,e={internal:function(n,t){return n.id!==t.id},external:function(n,t){return n.id===t.id},both:function(){return!0}};o.onInit(function(){var r=o.plugins.topojson.world,l=r.objects.countries,a=n.type||"internal";i=t.mesh(r,l,e[a])}),o.onDraw(function(){o.withSavedContext(function(t){t.beginPath(),o.path.context(t)(i),t.strokeStyle=n.stroke||"gray",n.lineWidth&&(t.lineWidth=n.lineWidth),t.stroke()})})}},u.plugins.earth=function(n){n=n||{};var t=n.topojson||{},o=n.oceans||{},i=n.land||{},e=n.borders||{};return function(n){u.plugins.topojson(t)(n),u.plugins.oceans(o)(n),u.plugins.land(i)(n),u.plugins.borders(e)(n)}},u.plugins.pings=function(t){var o=[];t=t||{};var i=function(n,i,e){e=e||{},e.color=e.color||t.color||"white",e.angle=e.angle||t.angle||5,e.ttl=e.ttl||t.ttl||2e3;var r={time:new Date,options:e};t.latitudeFirst?(r.lat=n,r.lng=i):(r.lng=n,r.lat=i),o.push(r)},e=function(n,t,i){for(var e=[],l=0;l<o.length;l++){var a=o[l],c=i-a.time;c<a.options.ttl&&(e.push(a),r(n,t,i,c,a))}o=e},r=function(t,o,i,e,r){var l=1-e/r.options.ttl,a=n.rgb(r.options.color);a="rgba("+a.r+","+a.g+","+a.b+","+l+")",o.strokeStyle=a;var c=n.geo.circle().origin([r.lng,r.lat]).angle(e/r.options.ttl*r.options.angle)();o.beginPath(),t.path.context(o)(c),o.stroke()};return function(n){n.plugins.pings={add:i},n.onDraw(function(){var t=new Date;n.withSavedContext(function(o){e(n,o,t)})})}},u.plugins.zoom=function(t){t=t||{};var o=function(){},i=t.onZoomStart||o,e=t.onZoomEnd||o,r=t.onZoom||o,l=t.afterZoom||o,a=t.initialScale,c=t.scaleExtent||[50,2e3];return function(t){t.onInit(function(){var o=n.behavior.zoom().scaleExtent(c);null!==a&&void 0!==a?o.scale(a):o.scale(t.projection.scale()),o.on("zoomstart",i.bind(t)).on("zoomend",e.bind(t)).on("zoom",function(){r.call(t),t.projection.scale(n.event.scale),l.call(t)}),n.select(t.canvas).call(o)})}},u.plugins.drag=function(t){t=t||{};var o=function(){},i=t.onDragStart||o,e=t.onDragEnd||o,r=t.onDrag||o,l=t.afterDrag||o;return function(t){t.onInit(function(){var o=n.behavior.drag().on("dragstart",i.bind(t)).on("dragend",e.bind(t)).on("drag",function(){r.call(t);var o=n.event.dx,i=n.event.dy,e=t.projection.rotate(),a=t.projection.scale(),c=n.scale.linear().domain([-1*a,a]).range([-90,90]),u=c(o),s=c(i);e[0]+=u,e[1]-=s,e[1]>90&&(e[1]=90),e[1]<-90&&(e[1]=-90),e[0]>=180&&(e[0]-=360),t.projection.rotate(e),l.call(t)});n.select(t.canvas).call(o)})}},u});
|
||||
Loading…
Reference in New Issue
Block a user