登录/注册

首页 › 活字格专区 › 求助中心 › 查看内容

金牌服务用户

148 主题	360 帖子	1252 积分

金牌服务用户

积分: 1252

5787
金币
148
主题
360
帖子

最新发帖

[已处理] 如何通过JS调整图表样式

465606055
金牌服务用户 / 发表于：2021-7-23 16:36 / 查看：4554 / 回复：4

0金币

本帖最后由 Joe.xu 于 2021-8-5 11:22 编辑

怎么让折线图的横坐标换到上面，纵坐标换到右侧；

附件: 您需要登录才可以下载或查看，没有帐号？立即注册

收藏

回复

echarts 坐标轴图表

4 个回复

倒序浏览

Chelsey.Wang
论坛元老 / 发表于：2021-7-23 16:36:25 沙发

本帖最后由 Chelsey.Wang 于 2021-7-26 16:50 编辑

可以通过Echarts的API，使用JS来调整坐标轴的位置Documentation - Apache ECharts

添加全局JS

示例代码：

Forguncy.Helper.preSetEchartOption = function (option, pageName, chartName) {
if (pageName == "页面1" && chartName == "Chart1") {
//x轴上移并反转
option.xAxis.position = 'top';
option.xAxis.inverse = true;
//y轴右移并反转
option.yAxis.position = 'right';
option.yAxis.inverse = true;
//通过garid可以调整图表到边框的距离
option.grid.top = '10%';
}
}

复制代码

移动完坐标轴后，需要通过grid调整图表到边框的距离，

相关的配置项可以参考Echarts的文档：Documentation - Apache ECharts
这里还有一个可以快速检索各种配置项和方法的网站，也分享给大家：
如何快速上手ECharts_w3cschool

本帖子中包含更多资源

您需要登录才可以下载或查看，没有帐号？立即注册

x

回复 使用道具举报

随风 
银牌会员 / 发表于：2021-7-23 18:05:38 板凳

数据交换一下就行

回复 使用道具举报

137294886
金牌服务用户 / 发表于：2022-12-3 19:55:44 地板

回复 使用道具举报

Joe.xu
超级版主 / 发表于：2022-12-5 09:16:45 5^#

感谢您对活字格的支持。
后面有问题，欢迎继续发新帖交流

回复 使用道具举报