1

機能をOracle Application Expressに統合しようとしていvis.jsますが、まったく機能していないようです。

スクリプトを個別に実行している場合は正常に動作しますが、APEX でスクリプト (vis.min.css) / (vis.min.js) を読み込もうとすると、次のようになりSCRIPT5009: 'vis' is undefinedますSCRIPT1028: Expected identifier, string or number

上記の行は、次のコード行につながります。

  • 私のスクリプトで:

    var parsedData = vis.network.convertDot(DOTstring);  --> vis is undefined
    
  • vis.min.js:

    (...)function o(t){return t&&t.__esModule?t:{default:t}}var n=i(2),s=o(n),r=i(55),a=o(r) (...) -> Expected identifier, string or number
    

vis.min.js/vis.min.cssおよびはdraw_diagram.jsAPEX (共有コンポーネント セクションの下) に静的ファイルとしてロードされ、HTML Headerセクションで次のように定義されます。

<script src="#APP_IMAGES#vis#MIN#.js" type="text/javascript"></script>
<link rel="stylesheet" href="#APP_IMAGES#vis#MIN#.css" type="text/css">

<script src="#APP_IMAGES#draw_diagram.js" type="text/javascript"></script>

必要なセクションPage Template Bodyを追加しました:divRegion Source

<div id="my_network"></div>

ただし、変更を適用して HTML ページに移動して結果を確認すると、コンソールに上記のエラーしか表示されません。

また、CDN からファイルを読み込もうとしましたが、結果は同じです。

カスタム スクリプトは次のようになります。

var DOTstring = "some_dot_config_string_here";
var parsedData = vis.network.convertDot(DOTstring);
var container = document.getElementById('my_network');

var data = {
    nodes: parsedData.nodes,
    edges: parsedData.edges
};

var options = {
    layout: {
        hierarchical: {
            direction: "UD",
            sortMethod: "directed",
            nodeSpacing: 250
        }
    },
    physics: false,
    interaction: {
        dragNodes: false,
        dragView: true,
        navigationButtons: true
    }
};

// create a network
var network = new vis.Network(container, data, options);
network.setSize('1800px', '840px');
network.redraw();

なぜこれが起こるのかについてのアイデアはありますか?

4

1 に答える 1