2016-08-18 4 views
1

私はD3オブジェクトの値を設定して呼び出すために使用しているD3 Dart JS Interopを定義しました。これはうまくいきます。残念なことにD3はセッターとゲッタの両方に同じ関数を使い、引数を分けるための引数の量に依存します。入力用のDart JS Interop関数のオーバーロード

例えば、アークオブジェクトは(JavaScriptで)このようなInnerRadiusを設定および取得する機能を持っています

var arc = d3.arc().innerRadius(25); 
//arc with innerRadius of 25 
var radius = arc.innerRadius(); 
//radius is 25 

私が定義したダートラッパーは次のようになります。

@JS('d3') 
library d3; 

import 'dart:js'; 
import "package:js/js.dart"; 

@JS("arc") 
class Arc { 
    external Arc innerRadius(num innerRadius); 
    external Arc(); 
} 
は、

そして、私はこのようなラッパーを定義したいと思います:

@JS("arc") 
class Arc { 
    external Arc innerRadius(num innerRadius); 
    external num innerRadius(); 
    external Arc(); 
} 

をしかし、それは名前がすでにあることについて不平を言います定義された。どのようにしてダーツラッパーを定義して、入力しながら値を設定して呼び出すことができるのでしょうか?

D3は、次のように弧を定義します。

function arcInnerRadius(d) { 
    return d.innerRadius; 
} 

function constant$1(x) { 
    return function constant() { 
     return x; 
    } 
} 

function arc() { 
    var innerRadius = arcInnerRadius; 

    function arc() { 
     var r0 = +innerRadius.apply(this, arguments); 
     //calculate and return path 
    } 

    arc.innerRadius = function(_) { 
     if(arguments.length) { 
      if(_ === "function") { 
       innerRadius = _; 
      } else { 
       innerRadius = constant$1(+_); 
      } 
      return arc; 
     } 
     return innerRadius; 
    } 

    return arc; 
} 

したがってゲッターとセッターの構文が正しくそれをラップしません。 innerRadiusを設定すると、内部の値ではなくコードによって呼び出されない関数が設定されるため、

醜い解決方法があります。入力を省略してパラメータをオプションにすると、両方を行うことができます。

@JS('d3') 
library d3; 

import 'dart:js'; 
import "package:js/js.dart"; 


@JS("arc") 
class Arc { 
    external Arc(); 
    external innerRadius([num innerRadius]); 
} 

あなたはこのようにそれを呼び出すことができます::だから私の現在のソリューションは、このようなラッパーを定義することです

Arc arc = new Arc() 
    ..innerRadius(25); 
num radius = arc.innerRadius(); 

これは、我々はの値の一部を失うという点で欠点を動作しますが、持っています入力することができないということで、半径を強制的に数値にすることができます。

Point<num> radius = arc.innerRadius(); 

そして、それは実行時まで爆発しません。それは、これは同様に有効である、です。

これは、マッピングしている関数と一致しますが、実際には、型を使ってそれを実行し、同じ型を返すことができる同じ名前の関数を定義することができます。

答えて

0

我々 DartにはTypeScriptファイルからそうするためのツールがあるので、独自のJavaScript定義ファイルを定義する必要はありません。 JS Facade Generatorofficial Dart Page about JS Interoperabilityにこれを使用する方法の詳細があります。

DefinitelyTyped projectのおかげで、ほぼ確実にこれを実行できるタイプスクリプトファイルがあります。そうでない場合は、代わりにそれらの1つを書いてください。これは、DartとTypeScriptの両方のコミュニティに役立ちます。

1

あなたの質問が正しく分かったら、innerRadius(value)を設定してinnerRadiusを取得できるようにしたいとします。そのために、私は次のことを行うだろう...

external Arc set innerRadius(num value); 
external num get innerRadius; 

上記では、ゲッターは、次のように使用されるため除いて、求めているものをほぼ正確に行うだろう...

num radius = arc.innerRadius; 
+0

私はこれを試しましたが、D3の実装方法のせいで動作しません。私はこれがなぜ機能しないのかという質問を更新しました。しかし、提案をありがとう。 :) –

関連する問題