Browse Source

added Bart to the example 34!

v3_develop
Alex de Mulder 10 years ago
parent
commit
1bba690963
15 changed files with 39 additions and 23 deletions
  1. +39
    -23
      examples/network/34_circular_images.html
  2. BIN
      examples/network/img/indonesia/1.png
  3. BIN
      examples/network/img/indonesia/10.png
  4. BIN
      examples/network/img/indonesia/11.png
  5. BIN
      examples/network/img/indonesia/12.png
  6. BIN
      examples/network/img/indonesia/13.png
  7. BIN
      examples/network/img/indonesia/14.png
  8. BIN
      examples/network/img/indonesia/2.png
  9. BIN
      examples/network/img/indonesia/3.png
  10. BIN
      examples/network/img/indonesia/4.png
  11. BIN
      examples/network/img/indonesia/5.png
  12. BIN
      examples/network/img/indonesia/6.png
  13. BIN
      examples/network/img/indonesia/7.png
  14. BIN
      examples/network/img/indonesia/8.png
  15. BIN
      examples/network/img/indonesia/9.png

+ 39
- 23
examples/network/34_circular_images.html View File

@ -8,9 +8,10 @@
font: 10pt arial; font: 10pt arial;
} }
#mynetwork { #mynetwork {
width: 600px;
height: 600px;
width: 800px;
height: 800px;
border: 1px solid lightgray; border: 1px solid lightgray;
background-color:#333333;
} }
</style> </style>
@ -28,28 +29,41 @@
function draw() { function draw() {
// create people. // create people.
// value corresponds with the age of the person // value corresponds with the age of the person
var DIR = 'img/soft-scraps-icons/';
var DIR = 'img/indonesia/';
nodes = [ nodes = [
{id: 3, shape: 'circularImage', label: 'Barney', title: 'Barney (12 years old)', image: DIR + 'User-Administrator-Blue-icon.png'},
{id: 4, shape: 'circularImage', label: 'Coley', title: 'Coley (16 years old)', image: DIR + 'User-Administrator-Green-icon.png'},
{id: 5, shape: 'circularImage', label: 'Grant', title: 'Grant (17 years old)', image: DIR + 'User-Coat-Blue-icon.png'},
{id: 6, shape: 'circularImage', label: 'Langdon', title: 'Langdon (15 years old)', image: DIR + 'User-Coat-Green-icon.png'},
{id: 7, shape: 'circularImage', label: 'Lee', title: 'Lee (6 years old)', image: DIR + 'User-Coat-Red-icon.png'},
{id: 9, shape: 'circularImage', label: 'Mick', title: 'Mick (30 years old)', image: DIR + 'User-Preppy-Blue-icon.png'},
{id: 10, shape: 'circularImage', label: 'Tod', title: 'Tod (18 years old)', image: DIR + 'User-Preppy-Red-icon.png'}
{id: 1, shape: 'circularImage', image: DIR + '1.png'},
{id: 2, shape: 'circularImage', image: DIR + '2.png'},
{id: 3, shape: 'circularImage', image: DIR + '3.png'},
{id: 4, label:"pictures by this guy!", shape: 'circularImage', image: DIR + '4.png'},
{id: 5, shape: 'circularImage', image: DIR + '5.png'},
{id: 6, shape: 'circularImage', image: DIR + '6.png'},
{id: 7, shape: 'circularImage', image: DIR + '7.png'},
{id: 8, shape: 'circularImage', image: DIR + '8.png'},
{id: 9, shape: 'circularImage', image: DIR + '9.png'},
{id: 10, shape: 'circularImage', image: DIR + '10.png'},
{id: 11, shape: 'circularImage', image: DIR + '11.png'},
{id: 12, shape: 'circularImage', image: DIR + '12.png'},
{id: 13, shape: 'circularImage', image: DIR + '13.png'},
{id: 14, shape: 'circularImage', image: DIR + '14.png'}
]; ];
// create connetions between people // create connetions between people
// value corresponds with the amount of contact between two people // value corresponds with the amount of contact between two people
edges = [ edges = [
{from: 4, to: 6, title: '8 emails per week'},
{from: 5, to: 7, title: '2 emails per week'},
{from: 4, to: 5, title: '1 emails per week'},
{from: 9, to: 10, title: '2 emails per week'},
{from: 2, to: 3, title: '6 emails per week'},
{from: 3, to: 9, title: '4 emails per week'},
{from: 5, to: 3, title: '1 emails per week'},
{from: 2, to: 7, title: '4 emails per week'}
{from: 1, to: 2},
{from: 2, to: 3},
{from: 2, to: 4},
{from: 4, to: 5},
{from: 4, to: 10},
{from: 4, to: 6},
{from: 6, to: 7},
{from: 7, to: 8},
{from: 8, to: 9},
{from: 8, to: 10},
{from: 10, to: 11},
{from: 11, to: 12},
{from: 12, to: 13},
{from: 13, to: 14},
]; ];
// create a network // create a network
@ -61,14 +75,16 @@
var options = { var options = {
nodes: { nodes: {
shape: 'circle', shape: 'circle',
borderWidth:4,
color: { color: {
border: 'orange',
background: 'yellow',
border: '#222222',
background: '#ffffff',
highlight: { highlight: {
border: 'darkorange',
background: 'gold'
border: '#428eff',
background: '#ffffff'
} }
}
},
fontColor:'#eeeeee'
}, },
edges: { edges: {
color: 'lightgray' color: 'lightgray'

BIN
examples/network/img/indonesia/1.png View File

Before After
Width: 64  |  Height: 64  |  Size: 30 KiB

BIN
examples/network/img/indonesia/10.png View File

Before After
Width: 64  |  Height: 64  |  Size: 28 KiB

BIN
examples/network/img/indonesia/11.png View File

Before After
Width: 64  |  Height: 64  |  Size: 28 KiB

BIN
examples/network/img/indonesia/12.png View File

Before After
Width: 64  |  Height: 64  |  Size: 29 KiB

BIN
examples/network/img/indonesia/13.png View File

Before After
Width: 64  |  Height: 57  |  Size: 30 KiB

BIN
examples/network/img/indonesia/14.png View File

Before After
Width: 64  |  Height: 64  |  Size: 30 KiB

BIN
examples/network/img/indonesia/2.png View File

Before After
Width: 64  |  Height: 64  |  Size: 31 KiB

BIN
examples/network/img/indonesia/3.png View File

Before After
Width: 64  |  Height: 64  |  Size: 31 KiB

BIN
examples/network/img/indonesia/4.png View File

Before After
Width: 64  |  Height: 64  |  Size: 31 KiB

BIN
examples/network/img/indonesia/5.png View File

Before After
Width: 64  |  Height: 64  |  Size: 31 KiB

BIN
examples/network/img/indonesia/6.png View File

Before After
Width: 64  |  Height: 64  |  Size: 30 KiB

BIN
examples/network/img/indonesia/7.png View File

Before After
Width: 64  |  Height: 64  |  Size: 29 KiB

BIN
examples/network/img/indonesia/8.png View File

Before After
Width: 64  |  Height: 64  |  Size: 31 KiB

BIN
examples/network/img/indonesia/9.png View File

Before After
Width: 64  |  Height: 64  |  Size: 30 KiB

Loading…
Cancel
Save