配列のリーフレットマーカーの色の基底を生成する

Question

私はマップ上の点に色で塗りつぶされた配列に基づいて動的な色を与えようとしています。

現在、私のコードの色は、関数内で定義されています。

リーフレットで呼び出され

function getColor(keten) { 
    return keten == "MacDonalds" ? '#800888' : 
      keten == "Subway"  ? '#969696' : 
      keten == "KFC"   ? '#081d58' : 
             '#252525' ; 
    } 

：

window["mapDataLayer"] = L.geoJson(geojson, { 
     pointToLayer: function (feature, latlng) { 
      var markerStyle = { 
       fillColor: getColor(feature.properties.Fastfoodketen), 
........ 

ための理由で、私は今、動的なデータを持っている、とする必要があり私のコードを少し変更してください。

私は2つの配列を作成しました.1つは色で、もう1つはレストランチェーン名で（動的に）塗りつぶしました。次に、両方の配列をループし、getColor()関数のデータのような変数を生成しようとします。その変数は同じ方法で返すことができます。この新しいコードで

arrayKleur = ["#a6cee3", "#1f78b4", "#b2df8a", "#33a02c", "#fb9a99", "#e31a1c", "#fdbf6f", "#ff7f00", "#6a3d9a", "#b15928"]; 
// filled for testing purposes, normally it's filled somewhere else 
arrayKeten = ["Kwalitaria", "NYPizza", "Dominos", "BurgerKing", "KFC", "Subway", "MacDonalds"]; 

var leafletData = []; 

for (i= 0; i < arrayKeten.length; i++){ 
    leafletData += 'keten == '+arrayKeten[i]+' ? '+arrayKleur[i]+' :</br>'; 
    } 
leafletData += 'red;' ; 

function getColor(keten) { 
    return leafletData; 
    } 

私はちょうどgetColor()の内容のように見えるが、私は私のマップ上のすべてのマーカーが今黒であるため、リーフレットは、stringでは動作しないことができると思いstringを取得します。

元のgetColor()関数を変更して、配列が組み込まれているかどうか試してみました。

function getColor(keten) { 
    return keten == arrayKeten[0] ? arrayKleur[0]: 
      keten == arrayKeten[1] ? arrayKleur[1]: 
      keten == arrayKeten[2] ? arrayKleur[2]: 
             '#999999' ; 
    } 

これは完璧に動作するので、私は私のstringと解決にかなり近いと思います。

コードを正しく機能させるには、何を変更する必要がありますか？あるいは、私は事を過度に複雑にしているのだろうか？

Answer 1

あなたは事を複雑にしています。あなたの文字列は色ではなく、JavaScriptのように見えるが、評価されないテキストの文字列です。 eval()を使用すると、99.9999％の時間が間違っています。代わりに

、古き良きindexOf使用：チェーンデータが可変で、よくマクドナルドとは全く異なるものになる可能性が

function getColor(keten) { 
    var i = arrayKeten.indexOf(keten); 
    if (i !== -1) { 
     return arrayKleur[ i ]; 
    } else { 
     return '#999999'; 
    } 
} 

Answer 2

なぜデフォルト値の色にオブジェクトを使用しないのですか？

function getColor(keten) { 
    var colors = { Kwalitaria: "#a6cee3", NYPizza: "#1f78b4", Dominos: "#b2df8a", BurgerKing: "#33a02c", KFC: "#fb9a99", Subway: "#e31a1c", MacDonalds: "#fdbf6f" }; 
    return colors[keten] || '#999999'; 
}