1
0
forked from PGL/Clyde

making the chart responsive

This commit is contained in:
Bartha Maxime 2024-04-04 16:14:19 +02:00
parent bd7d2c2d51
commit dbe28a7fed

View File

@ -1,6 +1,5 @@
<script setup> <script setup>
import { ref } from "vue"; import { ref } from "vue";
import {w} from "../../dist/assets/_plugin-vue_export-helper-Bvj9NrzX.js";
const input = ref(""); const input = ref("");
const statsOf = ref(""); const statsOf = ref("");
const statsBy = ref(""); const statsBy = ref("");
@ -61,11 +60,15 @@ const mydata = {
}, },
methods : { methods : {
chartInstance(chart){ chartInstance(chart){
console.log(chart) mydata.chart = chart
this.chart = chart;
}, },
update(){ update(){
this.chart.render(); mydata.options.title = {
fontColor: "white",
text: statsOf.value + " By "+ statsBy.value,
}
mydata.chart.render()
console.log(mydata.options.title)
setTimeout(this.update, 1000); setTimeout(this.update, 1000);
} }
} }
@ -108,7 +111,7 @@ const mydata = {
</select> </select>
</div> </div>
<div id="statsPie"> <div id="statsPie">
<CanvasJSChart :options="mydata.options" :style="mydata.styleOptions" @chart-ref="mydata.methods.chartInstance(this)"/> <CanvasJSChart :options="mydata.options" :style="mydata.styleOptions" @chart-ref="mydata.methods.chartInstance"/>
</div> </div>
</div> </div>
<div id="articles"> <div id="articles">