如何在 Oracle Apex 中使用静态 ID 定位图表系列？

Posted 2023-03-28

【中文标题】如何在 Oracle Apex 中使用静态 ID 定位图表系列？

【英文标题】：How to locate the chart series using static ID in Oracle Apex?

【发布时间】：2019-11-22 13:53:56

【问题描述】：

我现在正在使用 Oracle Apex 构建一个 Web 应用程序，我想在单击一个按钮后使用 javascript 将样式类添加到图表系列。根据Add filters to Interactive Grid via Javascript，我知道可以通过static id找到该区域并进行操作。因此，我给图表系列一个静态ID，我想知道如何定位图表系列，并在Dynamic Action中使用Javascript为图表添加样式css。

更新：

基于示例图表（区域）示例，我创建了一个名为change color 的按钮，并定义了一个动态操作，该操作将在单击该按钮时触发。真正的动作是执行 Javascript 代码，如下所示：

    $(function( options ) 

    // Setup a callback function which gets called when data is retrieved, to manipulate the series data
    options.dataFilter = function( data ) 
        data.series[ 0 ].color = "#90ee90";
        return data;
    ;

    return options;
);

执行 Javascript 后，data.series[0] 应更改为绿色。然而，执行后什么都没有发生。

【参考方案1】：

您应该使用 JavaScript，而不是 CSS...登录您的 APEX 工作区，单击 App Gallery 选项卡，然后安装 Sample Charts 应用程序。安装完成后，单击运行。登录应用程序，单击导航菜单中的区域，然后选择区域图表颜色（JavaScript 代码自定义）选项卡。这可能是您开始的最佳位置。

转到编辑页面，选择面积图（颜色 JavaScript 代码自定义）区域的属性，然后向下滚动到高级 > JavaScript 初始化代码。在那里，你会看到这段代码：

function( options ) 

    // Setup a callback function which gets called when data is retrieved, to manipulate the series data
    options.dataFilter = function( data ) 

        data.series[ 0 ].color = "#ED6647";
        data.series[ 0 ].borderColor = "#0F3248";
        data.series[ 0 ].markerDisplayed = "on";
        data.series[ 0 ].markerShape = "plus";
        data.series[ 0 ].markerColor = "red";
        data.series[ 0 ].markerSize = 8;
        data.series[ 0 ].pattern = "smallChecker";
        return data;
    ;

    return options;

请参阅 JET API 文档以了解有关系列选项的更多信息：https://www.oracle.com/webfolder/technetwork/jet/jsdocs/oj.ojChartSeries.html

如果您在初始化后尝试更改颜色，则需要使用option 方法获取系列数组。从那里，您可以更新所需系列的颜色属性，然后调用 refresh 方法来更新 DOM。

var series = apex.region("area1").widget().ojChart('option', 'series');

series[0].color = '#ED6647';

apex.region("area1").widget().ojChart('refresh');

【讨论】：

感谢您让我知道我可以使用 Javascript 来启动颜色。但是，我想要的是在页面上添加一个按钮，点击后可以更改 data.series[0] 颜色。我尝试在动态操作中复制粘贴并修改此 Javascript 代码，但它不起作用。

啊，我对Javascript代码做了一些更改，现在没有错误了。但是，即使我在动态操作的功能中设置了 data.series[ 0 ].color = "#000000"，颜色仍然相同。

您在说什么动态操作？您能否显示您正在使用的确切代码（将其添加到问题中）？

我已经更新了问题，你能检查一下吗？

非常感谢。我正在使用相同的情况但在函数内部（选项）-我想在这里获取此图表静态ID你能帮忙@DanMcGhan