我的 Symfony/ChartJS 應用程式有一點問題。
因此,如果我使用 JS 等創建圖表var myChart = new Chart,我可以輕松地銷毀圖表,myChart.destory();因為我可以處理 ChartObject。
我的問題:我用 SymfonyController 渲染的第一個圖表。所以我在我的控制器中渲染圖表
return $this->render('category.html.twig', [
'chart' => $chart]);
在 Twig 中,我為 Chart 分配了一個 ID {{ render_chart(chart, {'id': 'my-chart'}) }}。但我真的不知道如何在 Js 中處理整個 Chartobject。那么我怎樣才能破壞我用 Symfonycontroller 創建的圖表呢?有人有建議嗎?
先感謝您!
//EDIT 正常的方式const chart = Chart.getChart('my-chart');也不行。這是我的 Canvas-ConsoleLog 以獲取更多資訊:
<canvas data-controller="symfony--ux-chartjs--chart" data-symfony--ux-chartjs--chart-view-value="(i deleted the values for better legibility)" id="my-chart" style="display: block; box-sizing: border-box; height: 407.778px; width: 816.667px;" width="735" height="367"></canvas>
奇怪的是:當我嘗試日志時: console.log(document.getElementById("my-chart").getContext("2d"););它顯示:
CanvasRenderingContext2D {canvas: canvas#my-chart, globalAlpha: 1, globalCompositeOperation: 'source-over', filter: 'none', imageSmoothingEnabled: true, …}
canvas: canvas#my-chart
direction: "ltr"
fillStyle: "#000000"
filter: "none"
font: "12px \"Helvetica Neue\", Helvetica, Arial, sans-serif"
globalAlpha: 1
globalCompositeOperation: "source-over"
imageSmoothingEnabled: true
imageSmoothingQuality: "low"
lineCap: "butt"
lineDashOffset: 0
lineJoin: "miter"
lineWidth: 1
miterLimit: 10
shadowBlur: 0
shadowColor: "rgba(0, 0, 0, 0)"
shadowOffsetX: 0
shadowOffsetY: 0
strokeStyle: "#000000"
textAlign: "start"
textBaseline: "alphabetic"
[[Prototype]]: CanvasRenderingContext2D
所以日志顯示圖表被識別......
uj5u.com熱心網友回復:
symfny-ux 控制器在適當的刺激控制器中創建自己的 ChartJS 實體,并且該變數不能直接訪問。但是,symfony/ux 開發人員很聰明,他們創建了可以收聽的事件(例如)(鏈接)chartjs:connect
如果你這樣做,你最終會得到一個 JS 原生CustomEvent物件,并且在details這個事件的屬性中,你會發現chart之前在 symfiny-ux-controller 中為 chart.js 創建的傳遞的實體所以理論上你可以
document.addEventListener("chartjs:connect",(chartEv) => {
console.log(chartEv.details); // chartEv.details.chart.destroy()
});
我建議您觀看Ryan 的 Symfony UX 教程,尤其是“擴展 UX 控制器”一章,他嘗試new Chart()在您的案例中使用之前創建的類似實體。
uj5u.com熱心網友回復:
您可以使用getChartapi 方法 chart.js 在其自身上公開。
因此,當您知道畫布的 ID 時,您可以使用此 js 來獲取圖表物件:
const chart = Chart.getChart('my-chart');
轉載請註明出處,本文鏈接:https://www.uj5u.com/shujuku/438384.html
標籤:javascript 交响乐 图表.js
