echarts里边怎么写table标签

echarts里边怎么写table标签,第1张

HTML代码:

<div>

            <form method="post" id="form">

                <table align="center">

                    <tr>

                        <td align="right">

                        样品名称:

                        </td>

                        <td>

                            <input id="samNameTree" name="samNameTree" class="easyui-combotree" required="required" style="width:128px">

                        </td>

                        <td align="right">

                            检测时间:

                        </td>

                        <td>

                            <input class="easyui-validatebox" required="required" id="testTime" name="testTime" style="width: 128px"

                                class="Wdate" onfocus="WdatePicker({dateFmt:'yyyy-MM'})"

                                readonly="true" style="width: 125">

                        </td>

                    </tr>

                    <tr>

                        <td align="right">

                        </td>

                        <td colspan=2 align="right">

                            <a href="javascript:void(0)" id="mxbutton"

                                class="easyui-linkbutton" iconCls="icon-search" onclick="get()">查询</a>

                            <a href="javascript:void(0)" id="reastbutton"

                                class="easyui-linkbutton" iconCls="icon-reload"

                                onclick="rest()">重置</a>

                        </td>

                    </tr>

                </table>

            </form>

        </div>

        <div id="line" style="width: 1000px height: 500px margin: 0 auto"></div>

新建一个echarts.html文件,为ECharts准备一个具备大小(宽高)的Dom,如下图所示:新建<script>标签引入模块化单文件echarts.js,如下图所示:新建<script>标签中为模块加载器配置echarts和所需图表的路径(相对路径为从当前页面链接到echarts.js),如下图所示:<script>标签内动态加载echarts和所需图表,回调函数中可以初始化图表并驱动图表的生成,如下图所示:浏览器中打开ecarts.html,就可以看到以下效果,如下图所示:

首先,你的猜测是对的,我点开了官方的示例,然后发现刚点开时候,源码中并没有展开的部分,在点击展开之后,才在原列表下面生成了一个新的行,用以展示展开数据

这一点,是这个插件源码里为了节省渲染资源,优化之后造成的不便

虽然我没有很优雅的解决方案,不过这个方案应该是可行的:就是将id为myChart的元素放到其他地方(组件之外),隐藏起来,然后点击按钮的话,就可以直接绘制echarts图表了。再对表格展开事件进行绑定:@expand="...",在列展开时,将myChart元素填充到对应的列中去。


欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/bake/11457459.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-05-16
下一篇2023-05-16

发表评论

登录后才能评论

评论列表(0条)

    保存