mirror of
				https://github.com/KevinMidboe/vue-chartjs.git
				synced 2025-10-29 18:00:20 +00:00 
			
		
		
		
	✨ Add demo page for github pages
Signed-off-by: Jakub Juszczak <netghost03@gmail.com>
This commit is contained in:
		
							
								
								
									
										22
									
								
								demo/dist/vue-chartjs.js
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
							
						
						
									
										22
									
								
								demo/dist/vue-chartjs.js
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							
							
								
								
									
										1
									
								
								demo/dist/vue-chartjs.js.map
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
							
						
						
									
										1
									
								
								demo/dist/vue-chartjs.js.map
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							
							
								
								
									
										13
									
								
								demo/index.html
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										13
									
								
								demo/index.html
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,13 @@ | ||||
| <!DOCTYPE html> | ||||
| <html> | ||||
|   <head> | ||||
|     <meta charset="utf-8"> | ||||
|     <title>📊 Vue-ChartJs</title> | ||||
|   </head> | ||||
|   <body> | ||||
|     <div id="app"> | ||||
|       <app></app> | ||||
|     </div> | ||||
|     <script src="dist/vue-chart.js"></script> | ||||
|   </body> | ||||
| </html> | ||||
| @@ -1,12 +1,20 @@ | ||||
| <template> | ||||
|   <div class="container"> | ||||
|     <h1 style="text-align:center;margin:40px 0;">Barchart</h1> | ||||
|     <bar-example></bar-example> | ||||
|     <h1 style="text-align:center;margin:40px 0;">Barchart with reactive mixing for live data</h1> | ||||
|     <reactive-example></reactive-example> | ||||
|     <h1 style="text-align:center;margin:40px 0;">Linechart</h1> | ||||
|     <line-example></line-example> | ||||
|     <h1 style="text-align:center;margin:40px 0;">Doughnutchart</h1> | ||||
|     <doughnut-example></doughnut-example> | ||||
|     <h1 style="text-align:center;margin:40px 0;">Piechart</h1> | ||||
|     <pie-example></pie-example> | ||||
|     <h1 style="text-align:center;margin:40px 0;">Radarchart</h1> | ||||
|     <radar-example></radar-example> | ||||
|     <h1 style="text-align:center;margin:40px 0;">Polararea</h1> | ||||
|     <polar-area-example></polar-area-example> | ||||
|     <h1 style="text-align:center;margin:40px 0;">Bubblechart</h1> | ||||
|     <bubble-example></bubble-example> | ||||
|   </div> | ||||
| </template> | ||||
|   | ||||
| @@ -47,6 +47,6 @@ export default BubbleChart.extend({ | ||||
|           ] | ||||
|         } | ||||
|       ] | ||||
|     }) | ||||
|     }, {responsive: true, maintainAspectRatio: false}) | ||||
|   } | ||||
| }) | ||||
|   | ||||
| @@ -15,6 +15,6 @@ export default DoughnutChart.extend({ | ||||
|           data: [40, 20, 80, 10] | ||||
|         } | ||||
|       ] | ||||
|     }) | ||||
|     }, {responsive: true, maintainAspectRatio: false}) | ||||
|   } | ||||
| }) | ||||
|   | ||||
| @@ -11,6 +11,6 @@ export default LineChart.extend({ | ||||
|           data: [40, 39, 10, 40, 39, 80, 40] | ||||
|         } | ||||
|       ] | ||||
|     }) | ||||
|     }, {responsive: true, maintainAspectRatio: false}) | ||||
|   } | ||||
| }) | ||||
|   | ||||
| @@ -15,6 +15,6 @@ export default PieChart.extend({ | ||||
|           data: [40, 20, 80, 10] | ||||
|         } | ||||
|       ] | ||||
|     }) | ||||
|     }, {responsive: true, maintainAspectRatio: false}) | ||||
|   } | ||||
| }) | ||||
|   | ||||
| @@ -24,6 +24,6 @@ export default PolarAreaChart.extend({ | ||||
|           data: [28, 48, 40, 19, 96, 27, 100] | ||||
|         } | ||||
|       ] | ||||
|     }) | ||||
|     }, {responsive: true, maintainAspectRatio: false}) | ||||
|   } | ||||
| }) | ||||
|   | ||||
| @@ -26,6 +26,6 @@ export default RadarChart.extend({ | ||||
|           data: [28, 48, 40, 19, 96, 27, 100] | ||||
|         } | ||||
|       ] | ||||
|     }) | ||||
|     }, {responsive: true, maintainAspectRatio: false}) | ||||
|   } | ||||
| }) | ||||
|   | ||||
| @@ -13,7 +13,7 @@ export default BarChart.extend({ | ||||
|   }, | ||||
|  | ||||
|   mounted () { | ||||
|     this.renderChart(this.chartData) | ||||
|     this.renderChart(this.chartData, {responsive: true, maintainAspectRatio: false}) | ||||
|  | ||||
|     setInterval(() => { | ||||
|       this.fillData() | ||||
|   | ||||
		Reference in New Issue
	
	Block a user