Commit 5a60b0d9 authored by PkSM3's avatar PkSM3

color nodes

parent 85f5697f
......@@ -148,11 +148,22 @@
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a>
<button id="clustbyCC">Clusterize</button>
</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<img title="Set Colors" src="img/colors.png" width="20px"><b class="caret"></b></img>
</a>
<ul class="dropdown-menu">
<li><a href="#" id="colorbyCC">By Country</a></li>
<li><a href="#"><strike>By Acronym</strike></a></li>
<li><a href="#" id="colorbyDef">By Default</a></li>
<li class="divider"></li>
<li><a href="#"> <span class="glyphicon glyphicon-repeat"></span> <strike>Properties</strike></a></li>
</ul>
</li>
</ul>
</div>
<!--
......
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>TinawebJS</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="utf-8">
<link rel="stylesheet" href="jquery/jquery-ui.css" media="screen">
<link rel="stylesheet" href="css/bootstrap.css" media="screen">
<link rel="stylesheet" href="css/freshstyle.css" media="screen">
<link rel="stylesheet" href="css/custom.css" media="screen">
<link rel="stylesheet" href="css/sidebar.css" media="screen">
<link rel="stylesheet" href="bootswatch/css/bootswatch.css">
<link rel="stylesheet" href="css/font.css" type="text/css">
<link rel="stylesheet" href="css/token-input.css" type="text/css">
</head>
<body class="gradient">
<span class="alert alert-danger">Glyphicon example</span>
<hr>
<div class="the-icons">
<span class=" glyphicon glyphicon-asterisk "></span> glyphicon glyphicon-asterisk <br>
<span class=" glyphicon glyphicon-plus "></span> glyphicon glyphicon-plus <br>
<span class=" glyphicon glyphicon-euro "></span> glyphicon glyphicon-euro <br>
<span class=" glyphicon glyphicon-minus "></span> glyphicon glyphicon-minus <br>
<span class=" glyphicon glyphicon-cloud "></span> glyphicon glyphicon-cloud <br>
<span class=" glyphicon glyphicon-envelope "></span> glyphicon glyphicon-envelope <br>
<span class=" glyphicon glyphicon-pencil "></span> glyphicon glyphicon-pencil <br>
<span class=" glyphicon glyphicon-glass "></span> glyphicon glyphicon-glass <br>
<span class=" glyphicon glyphicon-music "></span> glyphicon glyphicon-music <br>
<span class=" glyphicon glyphicon-search "></span> glyphicon glyphicon-search <br>
<span class=" glyphicon glyphicon-heart "></span> glyphicon glyphicon-heart <br>
<span class=" glyphicon glyphicon-star "></span> glyphicon glyphicon-star <br>
<span class=" glyphicon glyphicon-star-empty "></span> glyphicon glyphicon-star-empty <br>
<span class=" glyphicon glyphicon-user "></span> glyphicon glyphicon-user <br>
<span class=" glyphicon glyphicon-film "></span> glyphicon glyphicon-film <br>
<span class=" glyphicon glyphicon-th-large "></span> glyphicon glyphicon-th-large <br>
<span class=" glyphicon glyphicon-th "></span> glyphicon glyphicon-th <br>
<span class=" glyphicon glyphicon-th-list "></span> glyphicon glyphicon-th-list <br>
<span class=" glyphicon glyphicon-ok "></span> glyphicon glyphicon-ok <br>
<span class=" glyphicon glyphicon-remove "></span> glyphicon glyphicon-remove <br>
<span class=" glyphicon glyphicon-zoom-in "></span> glyphicon glyphicon-zoom-in <br>
<span class=" glyphicon glyphicon-zoom-out "></span> glyphicon glyphicon-zoom-out <br>
<span class=" glyphicon glyphicon-off "></span> glyphicon glyphicon-off <br>
<span class=" glyphicon glyphicon-signal "></span> glyphicon glyphicon-signal <br>
<span class=" glyphicon glyphicon-cog "></span> glyphicon glyphicon-cog <br>
<span class=" glyphicon glyphicon-trash "></span> glyphicon glyphicon-trash <br>
<span class=" glyphicon glyphicon-home "></span> glyphicon glyphicon-home <br>
<span class=" glyphicon glyphicon-file "></span> glyphicon glyphicon-file <br>
<span class=" glyphicon glyphicon-time "></span> glyphicon glyphicon-time <br>
<span class=" glyphicon glyphicon-road "></span> glyphicon glyphicon-road <br>
<span class=" glyphicon glyphicon-download-alt "></span> glyphicon glyphicon-download-alt <br>
<span class=" glyphicon glyphicon-download "></span> glyphicon glyphicon-download <br>
<span class=" glyphicon glyphicon-upload "></span> glyphicon glyphicon-upload <br>
<span class=" glyphicon glyphicon-inbox "></span> glyphicon glyphicon-inbox <br>
<span class=" glyphicon glyphicon-play-circle "></span> glyphicon glyphicon-play-circle <br>
<span class=" glyphicon glyphicon-repeat "></span> glyphicon glyphicon-repeat <br>
<span class=" glyphicon glyphicon-refresh "></span> glyphicon glyphicon-refresh <br>
<span class=" glyphicon glyphicon-list-alt "></span> glyphicon glyphicon-list-alt <br>
<span class=" glyphicon glyphicon-lock "></span> glyphicon glyphicon-lock <br>
<span class=" glyphicon glyphicon-flag "></span> glyphicon glyphicon-flag <br>
<span class=" glyphicon glyphicon-headphones "></span> glyphicon glyphicon-headphones <br>
<span class=" glyphicon glyphicon-volume-off "></span> glyphicon glyphicon-volume-off <br>
<span class=" glyphicon glyphicon-volume-down "></span> glyphicon glyphicon-volume-down <br>
<span class=" glyphicon glyphicon-volume-up "></span> glyphicon glyphicon-volume-up <br>
<span class=" glyphicon glyphicon-qrcode "></span> glyphicon glyphicon-qrcode <br>
<span class=" glyphicon glyphicon-barcode "></span> glyphicon glyphicon-barcode <br>
<span class=" glyphicon glyphicon-tag "></span> glyphicon glyphicon-tag <br>
<span class=" glyphicon glyphicon-tags "></span> glyphicon glyphicon-tags <br>
<span class=" glyphicon glyphicon-book "></span> glyphicon glyphicon-book <br>
<span class=" glyphicon glyphicon-bookmark "></span> glyphicon glyphicon-bookmark <br>
<span class=" glyphicon glyphicon-print "></span> glyphicon glyphicon-print <br>
<span class=" glyphicon glyphicon-camera "></span> glyphicon glyphicon-camera <br>
<span class=" glyphicon glyphicon-font "></span> glyphicon glyphicon-font <br>
<span class=" glyphicon glyphicon-bold "></span> glyphicon glyphicon-bold <br>
<span class=" glyphicon glyphicon-italic "></span> glyphicon glyphicon-italic <br>
<span class=" glyphicon glyphicon-text-height "></span> glyphicon glyphicon-text-height <br>
<span class=" glyphicon glyphicon-text-width "></span> glyphicon glyphicon-text-width <br>
<span class=" glyphicon glyphicon-align-left "></span> glyphicon glyphicon-align-left <br>
<span class=" glyphicon glyphicon-align-center "></span> glyphicon glyphicon-align-center <br>
<span class=" glyphicon glyphicon-align-right "></span> glyphicon glyphicon-align-right <br>
<span class=" glyphicon glyphicon-align-justify "></span> glyphicon glyphicon-align-justify <br>
<span class=" glyphicon glyphicon-list "></span> glyphicon glyphicon-list <br>
<span class=" glyphicon glyphicon-indent-left "></span> glyphicon glyphicon-indent-left <br>
<span class=" glyphicon glyphicon-indent-right "></span> glyphicon glyphicon-indent-right <br>
<span class=" glyphicon glyphicon-facetime-video "></span> glyphicon glyphicon-facetime-video <br>
<span class=" glyphicon glyphicon-picture "></span> glyphicon glyphicon-picture <br>
<span class=" glyphicon glyphicon-map-marker "></span> glyphicon glyphicon-map-marker <br>
<span class=" glyphicon glyphicon-adjust "></span> glyphicon glyphicon-adjust <br>
<span class=" glyphicon glyphicon-tint "></span> glyphicon glyphicon-tint <br>
<span class=" glyphicon glyphicon-edit "></span> glyphicon glyphicon-edit <br>
<span class=" glyphicon glyphicon-share "></span> glyphicon glyphicon-share <br>
<span class=" glyphicon glyphicon-check "></span> glyphicon glyphicon-check <br>
<span class=" glyphicon glyphicon-move "></span> glyphicon glyphicon-move <br>
<span class=" glyphicon glyphicon-step-backward "></span> glyphicon glyphicon-step-backward <br>
<span class=" glyphicon glyphicon-fast-backward "></span> glyphicon glyphicon-fast-backward <br>
<span class=" glyphicon glyphicon-backward "></span> glyphicon glyphicon-backward <br>
<span class=" glyphicon glyphicon-play "></span> glyphicon glyphicon-play <br>
<span class=" glyphicon glyphicon-pause "></span> glyphicon glyphicon-pause <br>
<span class=" glyphicon glyphicon-stop "></span> glyphicon glyphicon-stop <br>
<span class=" glyphicon glyphicon-forward "></span> glyphicon glyphicon-forward <br>
<span class=" glyphicon glyphicon-fast-forward "></span> glyphicon glyphicon-fast-forward <br>
<span class=" glyphicon glyphicon-step-forward "></span> glyphicon glyphicon-step-forward <br>
<span class=" glyphicon glyphicon-eject "></span> glyphicon glyphicon-eject <br>
<span class=" glyphicon glyphicon-chevron-left "></span> glyphicon glyphicon-chevron-left <br>
<span class=" glyphicon glyphicon-chevron-right "></span> glyphicon glyphicon-chevron-right <br>
<span class=" glyphicon glyphicon-plus-sign "></span> glyphicon glyphicon-plus-sign <br>
<span class=" glyphicon glyphicon-minus-sign "></span> glyphicon glyphicon-minus-sign <br>
<span class=" glyphicon glyphicon-remove-sign "></span> glyphicon glyphicon-remove-sign <br>
<span class=" glyphicon glyphicon-ok-sign "></span> glyphicon glyphicon-ok-sign <br>
<span class=" glyphicon glyphicon-question-sign "></span> glyphicon glyphicon-question-sign <br>
<span class=" glyphicon glyphicon-info-sign "></span> glyphicon glyphicon-info-sign <br>
<span class=" glyphicon glyphicon-screenshot "></span> glyphicon glyphicon-screenshot <br>
<span class=" glyphicon glyphicon-remove-circle "></span> glyphicon glyphicon-remove-circle <br>
<span class=" glyphicon glyphicon-ok-circle "></span> glyphicon glyphicon-ok-circle <br>
<span class=" glyphicon glyphicon-ban-circle "></span> glyphicon glyphicon-ban-circle <br>
<span class=" glyphicon glyphicon-arrow-left "></span> glyphicon glyphicon-arrow-left <br>
<span class=" glyphicon glyphicon-arrow-right "></span> glyphicon glyphicon-arrow-right <br>
<span class=" glyphicon glyphicon-arrow-up "></span> glyphicon glyphicon-arrow-up <br>
<span class=" glyphicon glyphicon-arrow-down "></span> glyphicon glyphicon-arrow-down <br>
<span class=" glyphicon glyphicon-share-alt "></span> glyphicon glyphicon-share-alt <br>
<span class=" glyphicon glyphicon-resize-full "></span> glyphicon glyphicon-resize-full <br>
<span class=" glyphicon glyphicon-resize-small "></span> glyphicon glyphicon-resize-small <br>
<span class=" glyphicon glyphicon-exclamation-sign "></span> glyphicon glyphicon-exclamation-sign <br>
<span class=" glyphicon glyphicon-gift "></span> glyphicon glyphicon-gift <br>
<span class=" glyphicon glyphicon-leaf "></span> glyphicon glyphicon-leaf <br>
<span class=" glyphicon glyphicon-fire "></span> glyphicon glyphicon-fire <br>
<span class=" glyphicon glyphicon-eye-open "></span> glyphicon glyphicon-eye-open <br>
<span class=" glyphicon glyphicon-eye-close "></span> glyphicon glyphicon-eye-close <br>
<span class=" glyphicon glyphicon-warning-sign "></span> glyphicon glyphicon-warning-sign <br>
<span class=" glyphicon glyphicon-plane "></span> glyphicon glyphicon-plane <br>
<span class=" glyphicon glyphicon-calendar "></span> glyphicon glyphicon-calendar <br>
<span class=" glyphicon glyphicon-random "></span> glyphicon glyphicon-random <br>
<span class=" glyphicon glyphicon-comment "></span> glyphicon glyphicon-comment <br>
<span class=" glyphicon glyphicon-magnet "></span> glyphicon glyphicon-magnet <br>
<span class=" glyphicon glyphicon-chevron-up "></span> glyphicon glyphicon-chevron-up <br>
<span class=" glyphicon glyphicon-chevron-down "></span> glyphicon glyphicon-chevron-down <br>
<span class=" glyphicon glyphicon-retweet "></span> glyphicon glyphicon-retweet <br>
<span class=" glyphicon glyphicon-shopping-cart "></span> glyphicon glyphicon-shopping-cart <br>
<span class=" glyphicon glyphicon-folder-close "></span> glyphicon glyphicon-folder-close <br>
<span class=" glyphicon glyphicon-folder-open "></span> glyphicon glyphicon-folder-open <br>
<span class=" glyphicon glyphicon-resize-vertical "></span> glyphicon glyphicon-resize-vertical <br>
<span class=" glyphicon glyphicon-resize-horizontal "></span> glyphicon glyphicon-resize-horizontal <br>
<span class=" glyphicon glyphicon-hdd "></span> glyphicon glyphicon-hdd <br>
<span class=" glyphicon glyphicon-bullhorn "></span> glyphicon glyphicon-bullhorn <br>
<span class=" glyphicon glyphicon-bell "></span> glyphicon glyphicon-bell <br>
<span class=" glyphicon glyphicon-certificate "></span> glyphicon glyphicon-certificate <br>
<span class=" glyphicon glyphicon-thumbs-up "></span> glyphicon glyphicon-thumbs-up <br>
<span class=" glyphicon glyphicon-thumbs-down "></span> glyphicon glyphicon-thumbs-down <br>
<span class=" glyphicon glyphicon-hand-right "></span> glyphicon glyphicon-hand-right <br>
<span class=" glyphicon glyphicon-hand-left "></span> glyphicon glyphicon-hand-left <br>
<span class=" glyphicon glyphicon-hand-up "></span> glyphicon glyphicon-hand-up <br>
<span class=" glyphicon glyphicon-hand-down "></span> glyphicon glyphicon-hand-down <br>
<span class=" glyphicon glyphicon-circle-arrow-right "></span> glyphicon glyphicon-circle-arrow-right <br>
<span class=" glyphicon glyphicon-circle-arrow-left "></span> glyphicon glyphicon-circle-arrow-left <br>
<span class=" glyphicon glyphicon-circle-arrow-up "></span> glyphicon glyphicon-circle-arrow-up <br>
<span class=" glyphicon glyphicon-circle-arrow-down "></span> glyphicon glyphicon-circle-arrow-down <br>
<span class=" glyphicon glyphicon-globe "></span> glyphicon glyphicon-globe <br>
<span class=" glyphicon glyphicon-wrench "></span> glyphicon glyphicon-wrench <br>
<span class=" glyphicon glyphicon-tasks "></span> glyphicon glyphicon-tasks <br>
<span class=" glyphicon glyphicon-filter "></span> glyphicon glyphicon-filter <br>
<span class=" glyphicon glyphicon-briefcase "></span> glyphicon glyphicon-briefcase <br>
<span class=" glyphicon glyphicon-fullscreen "></span> glyphicon glyphicon-fullscreen <br>
<span class=" glyphicon glyphicon-dashboard "></span> glyphicon glyphicon-dashboard <br>
<span class=" glyphicon glyphicon-paperclip "></span> glyphicon glyphicon-paperclip <br>
<span class=" glyphicon glyphicon-heart-empty "></span> glyphicon glyphicon-heart-empty <br>
<span class=" glyphicon glyphicon-link "></span> glyphicon glyphicon-link <br>
<span class=" glyphicon glyphicon-phone "></span> glyphicon glyphicon-phone <br>
<span class=" glyphicon glyphicon-pushpin "></span> glyphicon glyphicon-pushpin <br>
<span class=" glyphicon glyphicon-usd "></span> glyphicon glyphicon-usd <br>
<span class=" glyphicon glyphicon-gbp "></span> glyphicon glyphicon-gbp <br>
<span class=" glyphicon glyphicon-sort "></span> glyphicon glyphicon-sort <br>
<span class=" glyphicon glyphicon-sort-by-alphabet "></span> glyphicon glyphicon-sort-by-alphabet <br>
<span class=" glyphicon glyphicon-sort-by-alphabet-alt "></span> glyphicon glyphicon-sort-by-alphabet-alt <br>
<span class=" glyphicon glyphicon-sort-by-order "></span> glyphicon glyphicon-sort-by-order <br>
<span class=" glyphicon glyphicon-sort-by-order-alt "></span> glyphicon glyphicon-sort-by-order-alt <br>
<span class=" glyphicon glyphicon-sort-by-attributes "></span> glyphicon glyphicon-sort-by-attributes <br>
<span class=" glyphicon glyphicon-sort-by-attributes-alt "></span> glyphicon glyphicon-sort-by-attributes-alt <br>
<span class=" glyphicon glyphicon-unchecked "></span> glyphicon glyphicon-unchecked <br>
<span class=" glyphicon glyphicon-expand "></span> glyphicon glyphicon-expand <br>
<span class=" glyphicon glyphicon-collapse-down "></span> glyphicon glyphicon-collapse-down <br>
<span class=" glyphicon glyphicon-collapse-up "></span> glyphicon glyphicon-collapse-up <br>
<span class=" glyphicon glyphicon-log-in "></span> glyphicon glyphicon-log-in <br>
<span class=" glyphicon glyphicon-flash "></span> glyphicon glyphicon-flash <br>
<span class=" glyphicon glyphicon-log-out "></span> glyphicon glyphicon-log-out <br>
<span class=" glyphicon glyphicon-new-window "></span> glyphicon glyphicon-new-window <br>
<span class=" glyphicon glyphicon-record "></span> glyphicon glyphicon-record <br>
<span class=" glyphicon glyphicon-save "></span> glyphicon glyphicon-save <br>
<span class=" glyphicon glyphicon-open "></span> glyphicon glyphicon-open <br>
<span class=" glyphicon glyphicon-saved "></span> glyphicon glyphicon-saved <br>
<span class=" glyphicon glyphicon-import "></span> glyphicon glyphicon-import <br>
<span class=" glyphicon glyphicon-export "></span> glyphicon glyphicon-export <br>
<span class=" glyphicon glyphicon-send "></span> glyphicon glyphicon-send <br>
<span class=" glyphicon glyphicon-floppy-disk "></span> glyphicon glyphicon-floppy-disk <br>
<span class=" glyphicon glyphicon-floppy-saved "></span> glyphicon glyphicon-floppy-saved <br>
<span class=" glyphicon glyphicon-floppy-remove "></span> glyphicon glyphicon-floppy-remove <br>
<span class=" glyphicon glyphicon-floppy-save "></span> glyphicon glyphicon-floppy-save <br>
<span class=" glyphicon glyphicon-floppy-open "></span> glyphicon glyphicon-floppy-open <br>
<span class=" glyphicon glyphicon-credit-card "></span> glyphicon glyphicon-credit-card <br>
<span class=" glyphicon glyphicon-transfer "></span> glyphicon glyphicon-transfer <br>
<span class=" glyphicon glyphicon-cutlery "></span> glyphicon glyphicon-cutlery <br>
<span class=" glyphicon glyphicon-header "></span> glyphicon glyphicon-header <br>
<span class=" glyphicon glyphicon-compressed "></span> glyphicon glyphicon-compressed <br>
<span class=" glyphicon glyphicon-earphone "></span> glyphicon glyphicon-earphone <br>
<span class=" glyphicon glyphicon-phone-alt "></span> glyphicon glyphicon-phone-alt <br>
<span class=" glyphicon glyphicon-tower "></span> glyphicon glyphicon-tower <br>
<span class=" glyphicon glyphicon-stats "></span> glyphicon glyphicon-stats <br>
<span class=" glyphicon glyphicon-sd-video "></span> glyphicon glyphicon-sd-video <br>
<span class=" glyphicon glyphicon-hd-video "></span> glyphicon glyphicon-hd-video <br>
<span class=" glyphicon glyphicon-subtitles "></span> glyphicon glyphicon-subtitles <br>
<span class=" glyphicon glyphicon-sound-stereo "></span> glyphicon glyphicon-sound-stereo <br>
<span class=" glyphicon glyphicon-sound-dolby "></span> glyphicon glyphicon-sound-dolby <br>
<span class=" glyphicon glyphicon-sound-5-1 "></span> glyphicon glyphicon-sound-5-1 <br>
<span class=" glyphicon glyphicon-sound-6-1 "></span> glyphicon glyphicon-sound-6-1 <br>
<span class=" glyphicon glyphicon-sound-7-1 "></span> glyphicon glyphicon-sound-7-1 <br>
<span class=" glyphicon glyphicon-copyright-mark "></span> glyphicon glyphicon-copyright-mark <br>
<span class=" glyphicon glyphicon-registration-mark "></span> glyphicon glyphicon-registration-mark <br>
<span class=" glyphicon glyphicon-cloud-download "></span> glyphicon glyphicon-cloud-download <br>
<span class=" glyphicon glyphicon-cloud-upload "></span> glyphicon glyphicon-cloud-upload <br>
<span class=" glyphicon glyphicon-tree-conifer "></span> glyphicon glyphicon-tree-conifer <br>
<span class=" glyphicon glyphicon-tree-deciduous "></span> glyphicon glyphicon-tree-deciduous <br>
</div>
<script src="jquery/jquery-1.10.2.js" type="text/javascript"></script>
<script src="jquery/jquery-ui.js" type="text/javascript"></script>
<script src="libs/jquery/jquery.ba-dotimeout.min.js" type="text/javascript"></script>
<script src="libs/jquery/jquery.mousewheel.min.js" type="text/javascript"></script>
<script src="libs/jquery/jquery.tokeninput.js" type="text/javascript"></script>
<script src="libs/bootstrap/js/bootstrap.min.js"></script>
<script src="bootswatch/js/bootswatch.js"></script>
<script src="libs/bootstrap/js/bootstrap-modal.js" type="text/javascript"></script>
</body>
</html>
......@@ -681,10 +681,15 @@ function theListeners(){
});
$("#clustbyCC").click(function(){
$("#colorbyCC").click(function(){
clustersBy("country");
});
$("#colorbyDef").click(function(){
clustersBy("default");
});
$.doTimeout(10,function (){
var deftoph=$("#defaultop").height();
var refh=$("#fixedtop").height();
......
......@@ -164,7 +164,7 @@ function getCountries(){
}
function clustersBy(daclass) {
if(daclass=="country") {
if (daclass=="country") {
CCs = getCountries()
CCxID = {}
......@@ -173,19 +173,25 @@ function clustersBy(daclass) {
CCxID[code]=parseInt(i);
}
pr(CCxID)
var nodes = getVisibleNodes();
colorList.sort(function(){ return Math.random()-0.5; });
pr(colorList);
// pr(colorList);
for(var i in nodes) {
cc = nodes[i].attr["CC"]
if( !isUndef( cc ) && cc!="-" ) {
nodes[i].color = colorList[ CCxID[cc] ];
}
}
}
partialGraph.refresh()
partialGraph.draw();
if (daclass=="default") {
var nodes = getVisibleNodes();
for(var i in nodes) {
nodes[i].color = Nodes[ nodes[i].id ].color;
}
}
partialGraph.refresh()
partialGraph.draw();
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment