update

kongoon · May 23, 2016 · 6894035 · 6894035
1 parent e17cb9c
commit 6894035
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 8 deletions.
diff --git a/OrgChart.php b/OrgChart.php
@@ -10,7 +10,7 @@ class OrgChart extends Widget
 {
     public $htmlOptions = [];
     public $setupOptions = [];
-    public $options = [];
+    public $data = [];
 
     public function run()
     {
@@ -21,16 +21,16 @@ public function run()
         }
         echo Html::tag('div', '', $this->htmlOptions);
 
-        if(is_string($this->options)){
-            $this->options = Json::decode($this->options);
+        if(is_string($this->data)){
+            $this->data = Json::decode($this->data);
         }
         $this->registerAsset();
         parent::run();
     }
 
     protected function registerAsset()
     {
-        $jsOptions = Json::encode($this->options);
+        $jsData = Json::encode($this->data);
         $setupOptions = Json::encode($this->setupOptions);
         $js = "
             google.charts.load('current', {packages:[\"orgchart\"]});
@@ -43,12 +43,13 @@ function drawChart() {
                 data.addColumn('string', 'ToolTip');
 
                 // For each orgchart box, provide the name, manager, and tooltip to show.
-                data.addRows([
-                    ".$jsOptions."
-                ]);
+                data.addRows(
+                    ".$jsData."
+                );
 
                 // Create the chart.
                 var chart = new google.visualization.OrgChart(document.getElementById('".$this->id."'));
+                chart.draw(data, {allowHtml:true});
             }
         ";
         $this->view->registerJsFile('https://www.gstatic.com/charts/loader.js', ['depends' => [\yii\web\JqueryAsset::className()]]);

diff --git a/README.md b/README.md
@@ -3,7 +3,7 @@ Yii2 Organization Chart Widget
 
 Easily add [Google Visualization OrgChart](https://developers.google.com/chart/interactive/docs/gallery/orgchart#example) to your Yii2 application.
 
-![Screen Shot](https://#)
+![Screen Shot](https://www.programmerthailand.com/uploads/1/1463994364_yii2-organization-chart.jpg)
 
 Install
 -----
@@ -21,5 +21,15 @@ To use this widget, insert the following code into a view file:
 ```php
 use kongoon\orgchart\OrgChart;
 
+echo OrgChart::widget([
+    'data' => [
+            [['v' => 'Mike', 'f' => '<img src="https://placeholdit.imgix.net/~text?txtsize=20&txt=Mike&w=120&h=150" /><br  /> <strong>Mike</strong><br  />The President'],'', 'The President'],
+            [['v' => 'Jim', 'f' => '<img src="https://placeholdit.imgix.net/~text?txtsize=20&txt=Jim&w=120&h=150" /><br  /><strong>Jim</strong><br  />The Test'],'Mike', 'VP'],
+            [['v' => 'ทดสอบ', 'f' => '<img src="https://placeholdit.imgix.net/~text?txtsize=20&txt=ทดสอบ&w=120&h=150" /><br  /><strong>ทดสอบ</strong><br  />The Test'], 'Mike', ''],
+            [['v' => 'Bob', 'f' => '<img src="https://placeholdit.imgix.net/~text?txtsize=20&txt=Bob&w=120&h=150" /><br  /><strong>Bob</strong><br  />The Test'], 'Jim', 'Bob Sponge'],
+            [['v' => 'Caral', 'f' => '<img src="https://placeholdit.imgix.net/~text?txtsize=20&txt=Caral&w=120&h=150" /><br  /><strong>Caral</strong><br  />The Test'], 'Mike', 'Caral Title'],
+
+    ]
+]);
 
 ```