added ids to nodes

static/css/style.css

@@ -52,32 +52,110 @@
 #ahmed text {
 	fill: #703022;
   font-size: 20px;
-  font-family: 'Asul', sans-serif;
+  font-family: 'Vesper Libre', serif;
 }
 
 #mevlana text {
   fill: #703022;
   font-size: 20px;
-  font-family: 'Asul', sans-serif;
+  font-family: 'Vesper Libre', serif;
 
 }
 
 #haci text {
   fill: #703022;
   font-size: 20px;
-  font-family: 'Asul', sans-serif;
+  font-family: 'Vesper Libre', serif;
 }
 
 #dadaloglu text {
   fill: #C85E40;
   font-size: 20px;
-  font-family: 'Asul', sans-serif;
+  font-family: 'Vesper Libre', serif;
 }
 
 #dedekorkut text {
   fill: #C85E40;
   font-size: 20px;
-  font-family: 'Asul', sans-serif;
+  font-family: 'Vesper Libre', serif;
+}
+
+#asikN text {
+  fill: #C85E40;
+  font-size: 20px;
+  font-family: 'Vesper Libre', serif;
+}
+
+#asikA text {
+  fill: #C85E40;
+  font-size: 20px;
+  font-family: 'Vesper Libre', serif;
+}
+
+#asikM text {
+  fill: #C85E40;
+  font-size: 20px;
+  font-family: 'Vesper Libre', serif;
+}
+
+#karacaoglan text {
+  fill: #C85E40;
+  font-size: 20px;
+  font-family: 'Vesper Libre', serif;
+}
+
+#asikV text {
+  fill: #C85E40;
+  font-size: 20px;
+  font-family: 'Vesper Libre', serif;
+}
+
+#neset text {
+  fill: #C85E40;
+  font-size: 20px;
+  font-family: 'Vesper Libre', serif;
+}
+
+#muharrem text {
+  fill: #C85E40;
+  font-size: 20px;
+  font-family: 'Vesper Libre', serif;
+}
+
+#aliekber text {
+  fill: #C85E40;
+  font-size: 20px;
+  font-family: 'Vesper Libre', serif;
+}
+
+#dedeoglu text {
+  fill: #C85E40;
+  font-size: 20px;
+  font-family: 'Vesper Libre', serif;
+}
+
+#pir text {
+  fill: #C85E40;
+  font-size: 20px;
+  font-family: 'Vesper Libre', serif;
+}
+
+#yunus text {
+  fill: #C85E40;
+  font-size: 20px;
+  font-family: 'Vesper Libre', serif;
+}
+
+#kulN text {
+  fill: #C85E40;
+  font-size: 20px;
+  font-family: 'Vesper Libre', serif;
+}
+
+#kaygusuz text {
+  fill: #C85E40;
+  font-size: 20px;
+  font-family: 'Vesper Libre', serif;
 }
 
 svg{  width:100%; height:200%; }

static/js/d3_map.js

@@ -30,6 +30,7 @@ d3.json("/static/js/group1.json", function(error, json) {
       .attr("class", "node")
       .attr("id", function(d){return d.id})
 
+
       // .style("fill",function (d) { return 'red'; })
       // .on("click", function(d){
       //         scrolldiv(d);

static/js/group1.json

@@ -84,7 +84,9 @@
     {
       "name": "Ahmed Yesevi",
       "group": 2,
-      "id": "ahmed"
+      "id": "ahmed",
+      "class": "group2"
+
     },
     {
       "name": "Mevlana Celaleddin Rumi",
@@ -94,7 +96,7 @@
     {
       "name": "Hacı Bektaş-i Veli",
       "group": 2,
-      "id": "haci",
+      "id": "haci"
     }
   ],
   "links": [

templates/hello.html

@@ -5,12 +5,10 @@
 <div class="bg">
 <div class="row">
   <div class="col-md-7">
-    <div class="container-fluid">
     <div class="map_area">
       <script src="../static/js/d3_map.js"></script>
     </div>
   </div>
-  </div>
   <div class="col-md-5">
     <div class="row">
       <div class="col-md-12">
@@ -56,6 +54,7 @@
 </div>
  </div>
 </div>
+
 </div>
 <!-- scripts for mouse events -->
 <script>