Highchart+EasyUI动态控制图表位置

最新推荐文章于 2020-11-30 08:43:51 发布

ldldong

最新推荐文章于 2020-11-30 08:43:51 发布

阅读量2.7k

点赞数

分类专栏： GIS 文章标签： Highchart javascript easyui 前端

本文链接：https://blog.youkuaiyun.com/ldldong/article/details/26060665

版权

GIS 专栏收录该内容

10 篇文章

订阅专栏

Highchart图表绚丽，EasyUI制作各种框架、按钮非常简便，这两者组合在一起，效果更好。

我用EasyUI-dialog作为Highchart的renderto对象

<div id="provincedetail"  title="详情" class="easyui-dialog" style="border:0px;Z-INDEX: 151;left: 1510px; top: 695px; width:380px;height:230px;padding:1px;" closable="true"collapsible="true" minimizable="true" maximizable="true" resizable="true"></div>

这样就可以实现对图表的最大、最小化、关闭等操作，不用再添加任何代码就实现了。

Highchart图表的具体实现另一篇博客已经写了，这里再添加一个，动态控制图表的位置，Highchart并不提供动态改变图标位置，只提供设置初始位置，这个时候就可以利用EasyUI的特性了，easyui-dialog有内置函数实现控制位置。因为它继承与window和panel，panel有这个函数

$('#provincedetail').panel('move', { left: 1510, top: 235 });

可以自由设定left和top的值，自由动态控制图表位置。