代做网站app,安全联盟这种网站建设,怎么免费做网站,红鹊豆网络网站站建设HQChart实战教程66-动态调整HQChart布局大小 需求小程序h5AppHQChart插件源码地址 需求
在不销毁hqchart实例的情况下#xff0c;动态调整K线图或分时图的大小#xff0c; 如下图#xff0c;把图1的K线图大小调整为图2的大小
图1 图2
小程序
调整画布大小#xff0c;并… HQChart实战教程66-动态调整HQChart布局大小 需求小程序h5AppHQChart插件源码地址 需求
在不销毁hqchart实例的情况下动态调整K线图或分时图的大小 如下图把图1的K线图大小调整为图2的大小
图1 图2
小程序
调整画布大小并把当前的画布大小设置到hqchart里面然后调用hqchart实例的OnSize()函数就可以。 canvas classhistorychart idhistorychart type2d styleheight:{{Height}}px; width:{{Width}}px; bindtouchstarthistorytouchstart bindtouchmovehistorytouchmove bindtouchendhistorytouchend/canvas..........OnChangeSize(event){var width300;var height600;this.setData({ Width: width, Height: height}, () {});this.HistoryChart.CanvasElement.Widthwidth;this.HistoryChart.CanvasElement.Heightheight;var node this.HistoryChart.CanvasElement.CanvasNode.node;node._widthwidth;node._heightheight;//const dpr wx.getSystemInfoSync().pixelRatio;node.width width;node.height height;this.HistoryChart.OnSize();},
h5
调整绑定的div的大小 然后调用hqchart实例的OnSize()函数就可以 div idkline ..........
this.DivKLinedocument.getElementById(kline);
.....this.OnSizefunction() //自适应大小调整
{var height $(window).height()-50;var width $(window).width();//width50000;this.DivKLine.style.top0px;this.DivKLine.style.left0px;this.DivKLine.style.widthwidthpx;this.DivKLine.style.heightheightpx;this.Chart.OnSize();}App
调整画布大小并把当前的画布大小设置到hqchart里面然后调用hqchart实例的OnSize()函数就可以。 viewcanvas idkline2 canvas-idkline2 classkline2 v-bind:style{width: ChartWidthpx, height: ChartHeightpx} touchstartKLineTouchStart touchmoveKLineTouchMove touchendKLineTouchEnd /canvas
/viewOnTestChangeSize()
{this.ChartHeight500; this.ChartWidth300;g_JSChart.CanvasElement.Widththis.ChartWidth;g_JSChart.CanvasElement.Heightthis.ChartHeight;g_JSChart.OnSize();
},HQChart插件源码地址
https://github.com/jones2000/HQChart
