Skip to content

Instantly share code, notes, and snippets.

@domadev812
Forked from ToeJamson/1.html
Last active November 15, 2017 21:06

Revisions

  1. Star Develop revised this gist Oct 30, 2017. 1 changed file with 0 additions and 2 deletions.
    2 changes: 0 additions & 2 deletions 10.html
    Original file line number Diff line number Diff line change
    @@ -1,9 +1,7 @@
    <html>
    <head>

    <script type="text/javascript" src="http://pubnub.com/developers/eon/lib/eon-chart.js"></script>
    <link type="text/css" rel="stylesheet" href="http://pubnub.com/developers/eon/lib/eon.css" />

    </head>
    <body>
    <div id="chart"></div>
  2. Star Develop revised this gist Oct 19, 2017. 7 changed files with 48 additions and 45 deletions.
    4 changes: 2 additions & 2 deletions 1.html
    Original file line number Diff line number Diff line change
    @@ -1,2 +1,2 @@
    <script type="text/javascript" src="http://pubnub.com/developers/eon/lib/eon.js"></script>
    <link type="text/css" rel="stylesheet" href="http://pubnub.com/developers/eon/lib/eon.css" />
    <script type="text/javascript" src="//pubnub.github.io/eon/v/eon/1.0.0/eon.js"></script>
    <link type="text/css" rel="stylesheet" href="//pubnub.github.io/eon/v/eon/1.0.0/eon.css"/>
    40 changes: 22 additions & 18 deletions 10.html
    Original file line number Diff line number Diff line change
    @@ -9,41 +9,45 @@
    <div id="chart"></div>
    <script>
    var channel = "c3-gauge" + Math.random();

    eon.chart({
    channel: channel,
    pubnub: pubnub,
    channels: [channel],
    generate: {
    bindto: '#chart',
    data: {
    type: 'gauge',
    labels: true,
    type: 'gauge'
    },
    gauge: {
    min: 0,
    max: 100
    },
    color: {
    pattern: ['#FF0000', '#F6C600', '#60B044'],
    threshold: {
    values: [30, 60, 90]
    bar: {
    width: {
    ratio: 0.5
    }
    },
    tooltip: {
    show: false
    }
    }
    });
    });
    </script>
    <script>
    var pubnub = PUBNUB.init({
    publish_key: 'demo',
    subscribe_key: 'demo'
    var pubnub = new PubNub({
    publishKey: 'demo',
    subscribeKey: 'demo'
    });

    setInterval(function(){

    pubnub.publish({
    channel: channel,
    message: {
    columns: [['data', Math.random() * 99]]
    eon: {
    'Austin': Math.floor(Math.random() * 99),
    'New York': Math.floor(Math.random() * 99),
    'San Francisco': Math.floor(Math.random() * 99),
    'Portland': Math.floor(Math.random() * 99)
    }
    }
    })

    });
    }, 1000);
    </script>
    </body>
    31 changes: 14 additions & 17 deletions 12.html
    Original file line number Diff line number Diff line change
    @@ -17,8 +17,8 @@
    }
    </style>

    <script type="text/javascript" src="../../lib/eon.js"></script>
    <link type="text/css" rel="stylesheet" href="../../lib/eon.css" />
    <script type="text/javascript" src="//pubnub.github.io/eon/v/eon/1.0.0/eon.js"></script>
    <link type="text/css" rel="stylesheet" href="//pubnub.github.io/eon/v/eon/1.0.0/eon.css"/>

    </head>
    <body>
    @@ -31,25 +31,23 @@
    }
    </script>
    <script>

    eon.map({
    id: 'map',
    mb_token: 'pk.eyJ1IjoiaWFuamVubmluZ3MiLCJhIjoiZExwb0p5WSJ9.XLi48h-NOyJOCJuu1-h-Jg',
    mb_id: 'ianjennings.l896mh2e',
    channel: channel,
    connect: connect
    });
    pubnub: pubnub,
    channels: [channel],
    id: 'html-id',
    mbToken: '...',
    mbId: 'ianjennings.l896mh2e'
    });

    function connect() {

    var pubnub = PUBNUB.init({
    publish_key: 'demo',
    subscribe_key: 'demo'
    var pubnub = new PubNub({
    publishKey: 'demo',
    subscribeKey: 'demo'
    });
    setInterval(function(){

    PUBNUB.publish({
    channel: 'eon-map',
    setInterval(function(){
    pubnub.publish({
    channel: 'eon-map-multiple',
    message:
    [
    {"latlng":[31,-99]},
    @@ -58,7 +56,6 @@
    {"latlng":[35,-102]}
    ]
    });

    }, 1000);

    };
    2 changes: 1 addition & 1 deletion 3.html
    Original file line number Diff line number Diff line change
    @@ -1,3 +1,3 @@
    <script type="text/javascript" src="http://pubnub.com/developers/eon/lib/eon-map.js"></script>
    <script type="text/javascript" src="http://pubnub.com/developers/eon/lib/eon-chart.js"></script>
    <link type="text/css" rel="stylesheet" href="http://pubnub.com/developers/eon/lib/eon.css" />
    <link type="text/css" rel="stylesheet" href="//pubnub.github.io/eon/v/eon/1.0.0/eon.css"/>
    5 changes: 3 additions & 2 deletions 4.html
    Original file line number Diff line number Diff line change
    @@ -1,3 +1,4 @@
    <script type="text/javascript" src="http://pubnub.com/developers/eon/lib/eon-chart.js"></script>
    <link type="text/css" rel="stylesheet" href="http://pubnub.com/developers/eon/lib/eon.css" />
    <div id="chart"></div>
    <link type="text/css" rel="stylesheet" href="//pubnub.github.io/eon/v/eon/1.0.0/eon.css"/>
    <div id="chart"></div>

    2 changes: 1 addition & 1 deletion 6.html
    Original file line number Diff line number Diff line change
    @@ -1,3 +1,3 @@
    <script type="text/javascript" src="http://pubnub.com/developers/eon/lib/eon-map.js"></script>
    <link type="text/css" rel="stylesheet" href="http://pubnub.com/developers/eon/lib/eon.css" />
    <link type="text/css" rel="stylesheet" href="//pubnub.github.io/eon/v/eon/1.0.0/eon.css"/>
    <script>
    9 changes: 5 additions & 4 deletions 7.js
    Original file line number Diff line number Diff line change
    @@ -1,7 +1,8 @@
    eon.map({
    channel: 'map-channel' // pubnub channel for data
    id: 'map', // element id to bind to (#map)
    mb_token: 'pk.eyJ1IjoiaWFuamVubmluZ3MiLCJhIjoiZExwb0p5WSJ9.XLi48h-NOyJOCJuu1-h-Jg', // mapbox token
    mb_id: 'ianjennings.l896mh2e', // mapbox map id
    pubnub: pubnub,
    channels: ['map-channel'],
    id: 'map',
    mbToken: '...',
    mbId: 'ianjennings.l896mh2e'
    });
    </script>
  3. @ToeJamson ToeJamson created this gist Aug 27, 2015.
    2 changes: 2 additions & 0 deletions 1.html
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,2 @@
    <script type="text/javascript" src="http://pubnub.com/developers/eon/lib/eon.js"></script>
    <link type="text/css" rel="stylesheet" href="http://pubnub.com/developers/eon/lib/eon.css" />
    50 changes: 50 additions & 0 deletions 10.html
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,50 @@
    <html>
    <head>

    <script type="text/javascript" src="http://pubnub.com/developers/eon/lib/eon-chart.js"></script>
    <link type="text/css" rel="stylesheet" href="http://pubnub.com/developers/eon/lib/eon.css" />

    </head>
    <body>
    <div id="chart"></div>
    <script>
    var channel = "c3-gauge" + Math.random();
    eon.chart({
    channel: channel,
    generate: {
    bindto: '#chart',
    data: {
    type: 'gauge',
    },
    gauge: {
    min: 0,
    max: 100
    },
    color: {
    pattern: ['#FF0000', '#F6C600', '#60B044'],
    threshold: {
    values: [30, 60, 90]
    }
    }
    }
    });
    </script>
    <script>
    var pubnub = PUBNUB.init({
    publish_key: 'demo',
    subscribe_key: 'demo'
    });

    setInterval(function(){

    pubnub.publish({
    channel: channel,
    message: {
    columns: [['data', Math.random() * 99]]
    }
    })

    }, 1000);
    </script>
    </body>
    </html>
    8 changes: 8 additions & 0 deletions 11.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,8 @@
    [
    {
    latlng: [37.370375, -97.756138]
    },
    {},
    {}
    //...
    ]
    68 changes: 68 additions & 0 deletions 12.html
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,68 @@
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset=utf-8 />
    <title>Taco Transport</title>
    <meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
    <style>
    body {
    margin: 0;
    padding: 0;
    }
    #map {
    position:absolute;
    top:0;
    bottom:0;
    width:100%;
    }
    </style>

    <script type="text/javascript" src="../../lib/eon.js"></script>
    <link type="text/css" rel="stylesheet" href="../../lib/eon.css" />

    </head>
    <body>
    <div id='map'></div>
    <script>
    function getNonZeroRandomNumber(){
    var random = Math.floor(Math.random()*199) - 99;
    if(random==0) return getNonZeroRandomNumber();
    return random;
    }
    </script>
    <script>

    eon.map({
    id: 'map',
    mb_token: 'pk.eyJ1IjoiaWFuamVubmluZ3MiLCJhIjoiZExwb0p5WSJ9.XLi48h-NOyJOCJuu1-h-Jg',
    mb_id: 'ianjennings.l896mh2e',
    channel: channel,
    connect: connect
    });

    function connect() {

    var pubnub = PUBNUB.init({
    publish_key: 'demo',
    subscribe_key: 'demo'
    });
    setInterval(function(){

    PUBNUB.publish({
    channel: 'eon-map',
    message:
    [
    {"latlng":[31,-99]},
    {"latlng":[32,-100]},
    {"latlng":[33,-101]},
    {"latlng":[35,-102]}
    ]
    });

    }, 1000);

    };

    </script>
    </body>
    </html>
    2 changes: 2 additions & 0 deletions 2
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,2 @@
    bower install eon-chart
    bower install eon-map
    3 changes: 3 additions & 0 deletions 3.html
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,3 @@
    <script type="text/javascript" src="http://pubnub.com/developers/eon/lib/eon-map.js"></script>
    <script type="text/javascript" src="http://pubnub.com/developers/eon/lib/eon-chart.js"></script>
    <link type="text/css" rel="stylesheet" href="http://pubnub.com/developers/eon/lib/eon.css" />
    3 changes: 3 additions & 0 deletions 4.html
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,3 @@
    <script type="text/javascript" src="http://pubnub.com/developers/eon/lib/eon-chart.js"></script>
    <link type="text/css" rel="stylesheet" href="http://pubnub.com/developers/eon/lib/eon.css" />
    <div id="chart"></div>
    10 changes: 10 additions & 0 deletions 5.html
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,10 @@
    <script>
    eon.chart({
    channel: 'chart-channel', // the pubnub channel for real time data
    flow: true, // animate new points in
    generate: { // c3 chart object
    bindto: '#chart'
    },
    limit: 10 // the number of graph points
    });
    </script>
    3 changes: 3 additions & 0 deletions 6.html
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,3 @@
    <script type="text/javascript" src="http://pubnub.com/developers/eon/lib/eon-map.js"></script>
    <link type="text/css" rel="stylesheet" href="http://pubnub.com/developers/eon/lib/eon.css" />
    <script>
    7 changes: 7 additions & 0 deletions 7.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,7 @@
    eon.map({
    channel: 'map-channel' // pubnub channel for data
    id: 'map', // element id to bind to (#map)
    mb_token: 'pk.eyJ1IjoiaWFuamVubmluZ3MiLCJhIjoiZExwb0p5WSJ9.XLi48h-NOyJOCJuu1-h-Jg', // mapbox token
    mb_id: 'ianjennings.l896mh2e', // mapbox map id
    });
    </script>
    1 change: 1 addition & 0 deletions 8.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1 @@
    [key, value]
    8 changes: 8 additions & 0 deletions 9.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,8 @@
    {
    columns: [
    ['data', Math.random() * 99],
    [],
    []
    //...
    ]
    }