Register Register Member Login Member Login Member Login Forgot Password ??
PHP , ASP , ASP.NET, VB.NET, C#, Java , jQuery , Android , iOS , Windows Phone
 

Registered : 109,037

HOME > PHP > PHP Forum > Chart Javascript + PHP กราฟไปกระจุกอยู่ครับ ไม่ขึ้นมาเป็นกราฟ



 

Chart Javascript + PHP กราฟไปกระจุกอยู่ครับ ไม่ขึ้นมาเป็นกราฟ

 



Topic : 128750



โพสกระทู้ ( 27 )
บทความ ( 0 )



สถานะออฟไลน์




มีแถบเมนูด้านบนครับ ทำโดย ให้คลิ๊กแล้วไม่เปลี่ยนหน้า โดยตั้ง ID แล้ว เขียน javascript ใส่ลงไป ซึ่งแต่ละลิงค์ที่คลิ้กเข้าไป ก็จะมีกราฟ ทุกลิงค์ ที่จะโชว์ออกมา โดยกราฟเขียนโดยใช้ javascript เช่นกันแล้วเรียก id มาโชว์ มีประมาณ 10 กราฟ

ซึ่งเมื่อกดเข้าในแต่ละเมนู กราฟจะออกมาดังรูปครับ มันกระจุกอยู่
- แต่ว่าเกิดว่าไป resize ของ ตัว google chrome ไปย่อตัวหน้าต่าง กราฟก็ขึ้นปกติ
- หรือ กดเข้าในแต่ละเมนู ในขณะที่หน้าเว็บยังโหลดไม่เสร็จ กราฟก็ขึ้นปกติ
ต้องทำแบบนี้ทุกครั้งที่กดเข้าเมนูนั้นๆ กราฟถึงจะขึ้นเป็นปกติ
เกิดจากอะไรครับ
ตอนนี้ยังแก้ปัญหาไม่ได้
l



Tag : PHP, HTML, CSS, JavaScript







Move To Hilight (Stock) 
Send To Friend.Bookmark.
Date : 2017-08-30 15:25:10 By : gpTanawat View : 1540 Reply : 5
 

 

No. 1



โพสกระทู้ ( 9,586 )
บทความ ( 2 )



สถานะออฟไลน์


no code no idea






แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2017-08-30 22:00:38 By : Chaidhanan
 


 

No. 2



โพสกระทู้ ( 27 )
บทความ ( 0 )



สถานะออฟไลน์


Code (JavaScript)
<button class="active" onclick="openMenu(event, 'Menu2')" id="defaultOpen" >menu2</button>
<button class="tablinks" onclick="openMenu(event, 'Menu1')" >menu1</button>

<div id="Menu1" class="tabcontent" >                     
                      <div class="col-md-6">
                         <div class="chart" >
                               <div id="chart1"></div>
                         </div>
                      </div>                           
</div>
<div id="Menu2" class="tabcontent" >                     
                      <div class="col-md-6">
                         <div class="chart" >
                               <div id="chart2"></div>
                         </div>
                      </div>                           
</div>

<script>
                                function openMenu(evt, linkName) {
                                    var i, tabcontent, tablinks;
                                    tabcontent = document.getElementsByClassName("tabcontent");
                                    for (i = 0; i < tabcontent.length; i++) {
                                        tabcontent[i].style.display = "none";
                                    }
                                    tablinks = document.getElementsByClassName("tablinks");
                                    for (i = 0; i < tablinks.length; i++) {
                                        tablinks[i].className = tablinks[i].className.replace("active", "");
                                    }
                                    document.getElementById(linkName).style.display = "block";
                                    evt.currentTarget.className += "active";
                                }
                                document.getElementById("defaultOpen").click();
</script>


ประมาณนี้ครับ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2017-08-31 09:28:22 By : gpTanawat
 

 

No. 3



โพสกระทู้ ( 9,586 )
บทความ ( 2 )



สถานะออฟไลน์


ลองใส่ script เรียกใช้ function window resize ณ ตำแหน่งสุดท้ายของ html
เสมือนเรา ปรับขนาด browser window

โค๊ดที่ลงมาดูยังไงก็ไม่รู้ว่าโปรแกรมมันทำงานยังไง
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2017-08-31 11:10:20 By : Chaidhanan
 


 

No. 4



โพสกระทู้ ( 27 )
บทความ ( 0 )



สถานะออฟไลน์


Code (JavaScript)
var dataTopGMS = {
    labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun'], //, 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'
    series: [{
    	 data : [867266,
				641316,
				371155,
				460637,
				140400,
				132080,
				],
		      
        },{
         data : [630000,
				625000,
				318000,
				204000,
				658000,
				165000,
				],
     	}	
};
var optionsTopGMS = {
	
    lineSmooth: false,
    axisY: {
        offset: 70
    }, 
    low: 0,
    high: 1000000

};
Chartist.Line('#chart1', dataTopGMS, optionsTopGMS);



อันนี้เป็น script ของ chart ครับ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2017-08-31 11:50:21 By : gpTanawat
 


 

No. 5



โพสกระทู้ ( 9,586 )
บทความ ( 2 )



สถานะออฟไลน์


มีลิงค์ให้ไปดูไหม จะได้ไม่ต้อง viewsource เอาไฟล์ html และ javascript ทั้งหมดมา
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2017-08-31 20:49:34 By : Chaidhanan
 

   

ค้นหาข้อมูล


   
 

แสดงความคิดเห็น
Re : Chart Javascript + PHP กราฟไปกระจุกอยู่ครับ ไม่ขึ้นมาเป็นกราฟ
 
 
รายละเอียด
 
ตัวหนา ตัวเอียง ตัวขีดเส้นใต้ ตัวมีขีดกลาง| ตัวเรืองแสง ตัวมีเงา ตัวอักษรวิ่ง| จัดย่อหน้าอิสระ จัดย่อหน้าชิดซ้าย จัดย่อหน้ากึ่งกลาง จัดย่อหน้าชิดขวา| เส้นขวาง| ขนาดตัวอักษร แบบตัวอักษร
ใส่แฟลช ใส่รูป ใส่ไฮเปอร์ลิ้งค์ ใส่อีเมล์ ใส่ลิ้งค์ FTP| ใส่แถวของตาราง ใส่คอลัมน์ตาราง| ตัวยก ตัวห้อย ตัวพิมพ์ดีด| ใส่โค้ด ใส่การอ้างถึงคำพูด| ใส่ลีสต์
smiley for :lol: smiley for :ken: smiley for :D smiley for :) smiley for ;) smiley for :eek: smiley for :geek: smiley for :roll: smiley for :erm: smiley for :cool: smiley for :blank: smiley for :idea: smiley for :ehh: smiley for :aargh: smiley for :evil:
Insert PHP Code
Insert ASP Code
Insert VB.NET Code Insert C#.NET Code Insert JavaScript Code Insert C#.NET Code
Insert Java Code
Insert Android Code
Insert Objective-C Code
Insert XML Code
Insert SQL Code
Insert Code
เพื่อความเรียบร้อยของข้อความ ควรจัดรูปแบบให้พอดีกับขนาดของหน้าจอ เพื่อง่ายต่อการอ่านและสบายตา และตรวจสอบภาษาไทยให้ถูกต้อง

อัพโหลดแทรกรูปภาพ

Notice

เพื่อความปลอดภัยของเว็บบอร์ด ไม่อนุญาติให้แทรก แท็ก [img]....[/img] โดยการอัพโหลดไฟล์รูปจากที่อื่น เช่นเว็บไซต์ ฟรีอัพโหลดต่าง ๆ
อัพโหลดแทรกรูปภาพ ให้ใช้บริการอัพโหลดไฟล์ของไทยครีเอท และตัดรูปภาพให้พอดีกับสกรีน เพื่อความโหลดเร็วและไฟล์ไม่ถูกลบทิ้ง

   
  เพื่อความปลอดภัยและการตรวจสอบ กระทู้ที่แทรกไฟล์อัพโหลดไฟล์จากที่อื่น อาจจะถูกลบทิ้ง
 
โดย
อีเมล์
บวกค่าให้ถูก
<= ตัวเลขฮินดูอารบิก เช่น 123 (หรือล็อกอินเข้าระบบสมาชิกเพื่อไม่ต้องกรอก)







Exchange: นำเข้าสินค้าจากจีน, Taobao, เฟอร์นิเจอร์, ของพรีเมี่ยม, ร่ม, ปากกา, power bank, แฟลชไดร์ฟ, กระบอกน้ำ

Load balance : Server 05
ThaiCreate.Com Logo
© www.ThaiCreate.Com. 2003-2024 All Rights Reserved.
ไทยครีเอทบริการ จัดทำดูแลแก้ไข Web Application ทุกรูปแบบ (PHP, .Net Application, VB.Net, C#)
[Conditions Privacy Statement] ติดต่อโฆษณา 081-987-6107 อัตราราคา คลิกที่นี่