Question

我现在正在使用Oracle Apex来构建Web应用程序，并且我想使用Javascript单击一个按钮后向图表系列添加样式类。根据{{3}}，我知道可以通过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]应该更改为绿色。但是，执行后什么也没发生。

Answer 1

您应该使用JavaScript，而不是CSS ...登录到APEX Workspace，单击“应用程序库”选项卡，然后安装“示例图表”应用程序。安装完成后，单击“运行”。登录到该应用程序，在导航菜单中单击“区域”，然后选择“区域图颜色（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方法来获取系列的数组。从那里，您可以更新所需系列的color属性，然后调用refresh方法来更新DOM。

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

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

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

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

1 个答案: