質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

89.52%

javascriptのパラエータの読み込みがわからない

解決済

回答 3

投稿 編集

  • 評価
  • クリップ 1
  • VIEW 811

oyatsu8

score 83

javascriptのコードの中に、下記のような、test_nameが一致したら、JSONの中から、それに対応したものを読み込むというものがあったのですが、動かず、
どこをどうしたらいいのか分かりません。

特によく分からないのが、 (f) => です。
ネットで調べてもこのような表記があまりなく、
http://phpjavascriptroom.com/?t=js&p=array
ここで見た感じだと、連想配列から値を取り出す時に使われるようなのですが、、
アドバイスを頂けたら幸いです。

途中まで教えてもらったりもしていたのですが、
ほんとうによくわからなくなってきたので
質問し直すことにします

  var scale01 = [10000,5000,4000,3000,2000,1000,100];
  var scale02 = [1000,500,400,300,200,100,10];

  var pallet01 = ['#800026','#BD0026','#E31A1C','#FC4E2A','#FD8D3C','#FEB24C','#FED976','#FFEDA0'];
  var pallet02 = ["#f7fcfd","#e5f5f9","#ccece6","#99d8c9","#66c2a4","#41ae76","#238b45","#005824"];


  function getColorEx(d, scale, pallet) {
    return d > scale[0] ? pallet[0] :
        d > scale[1] ? pallet[1]:
        d > scale[2] ? pallet[2]:
        d > scale[3] ? pallet[3]:
        d > scale[4] ? pallet[4]:
        d > scale[5] ? pallet[5]:
        d > scale[6] ? pallet[6]:
        pallet[7];
  }

  map.attributionControl.addAttribution('data &copy; <a href=""></a>');

  //map.on start ここからoverlayのonイベントスタート
 //leafletのチェックボックスでどれがon/offされたかを見る
  map.on('overlayadd overlayremove baseLayerchange', function(a) {
    if(a.type == "overlayadd"){console.log("overlayaddです");}
    if(a.type == "overlayremove"){console.log("overlayremoveです");}
    overlay_name = a.name;
    overlay_type = a.type;

//ここからは全部onマウスイベントの処理 
   var geojson01;
   var geojson02;

  //共通部分 start
  function highlightFeature(e) {
    var layer = e.target;
    layer.setStyle({
      weight: 5,
      color: '#F00',
      dashArray: '',
      fillOpacity: 0.5
    });
    if (!L.Browser.ie && !L.Browser.opera && !L.Browser.edge) {
      layer.bringToFront();
    }
    info.update(layer.feature.properties);
  }
   function zoomToFeature(e) {
    map.fitBounds(e.target.getBounds());
  }
  //共通部分 end

  //ここも整頓したい
  function resetHighlight(e) {
    geojson01.resetStyle(e.target);
    info.update();
  }
  function resetHighlight02(e) {
    geojson02.resetStyle(e.target);
    info.update();
  }
  //ここまで整頓したい


//ここまで全部onマウスイベントの処理

  function onEachFeature(feature, layer) {
    layer.on({
      mouseover: highlightFeature,
      mouseout: resetHighlight,
      click: zoomToFeature
    });
  }
  function onEachFeature02(feature, layer) {
    layer.on({
      mouseover: highlightFeature,
      mouseout: resetHighlight02,
      click: zoomToFeature
    });
  }
  //tyleEx start
  function styleEx() {

    var fillColorFeild = if(overlay_name == "test01"){
       (f) => {f.properties.test01};
    } else if(overlay_name == "test02"){
       (f) => {f.properties.test02};
    }

////ここにどう読み込むかがわからない
     (feature) => {
       return {
         weight: 2,
         opacity: 1,
         color: 'white',
         dashArray: '3',
         fillOpacity: 0.5,
         fillColor: getColorEx(fillColorFeild(feature), scale--, pallet--)
       };
     }

  }//tyleEx end

  //createGeojson start
  function createGeojson() {
    L.geoJson(prefectureData, {
     style: styleEx(),
      onEachFeature: onEachFeature
    })
  }
  //createGeojson end

  geojson01 = createGeojson();
  geojson01.addTo(choropleth01);

  geojson02 = createGeojson();
  geojson02.addTo(choropleth02);
  });
  //onイベント終了
  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

質問への追記・修正、ベストアンサー選択の依頼

  • kei344

    2016/12/29 15:22

    質問文に追記されたものは何を参考にされたのでしょうか。参考記事があるのであればそのURLを貼ってください。

    キャンセル

  • 退会済みユーザー

    2016/12/29 20:00

    他のユーザから「意図的に内容が抹消された質問」という指摘を受けました
    解決後に編集機能を用いて質問内容を改変し関係のない内容にしたり、内容を削除する行為は禁止しています。
    投稿していただいた質問は、後に他の誰かが困ったときに助けになる情報資産になると考えるからです。
    「質問を編集する」ボタンから編集を行い、他のユーザにも質問内容が見えるように修正してください。

  • oyatsu8

    2016/12/30 02:53

    すみません、よくわからなくなってきました。

    キャンセル

回答 3

checkベストアンサー

+5

アロー関数というものでは?アロー関数を使うと、無名関数よりも短縮した形で書けるようになります。

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="utf-8">
    <title>タイトル</title>
</head>
<body>
<script>
    //このような関数が
    var hello1 = function (text) {
        alert(text);
    };
    //こんな風にかけるようになった
    var hello2 = (text) => {
        alert(text);
    };
    hello1("hello,world1");
    hello2("hello,world2");
</script>
</body>
</html>

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2016/12/29 11:14

    少し意味がわかりました!
    最初var fillColorFeild =
    だったのを、書き忘れたと思って
    var fillColorFeild = '';
    if(test_name == "テスト01"){
    (f) => {f.properties.aiueo};
    } else if(test_name == "テスト02"){
    (f) => {f.properties.kakikukeko};
    }

    にしていました、、
    var fillColorFeild
    if(test_name == "テスト01"){
    (f) => {f.properties.aiueo};
    } else if(test_name == "テスト02"){
    (f) => {f.properties.kakikukeko};
    }

    という事だったみたいです。

    キャンセル

  • 2016/12/30 02:53

    と思ったのですが、これも違うようでした。
    よくわからなくなってきたので、整理し直そうと思います。

    キャンセル

+2

アロー関数では?

【アロー関数 - JavaScript | MDN】
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/arrow_functions

【ES2015(ES6)新構文:アロー関数(Arrow function)|もっこりJavaScript|ANALOGIC(アナロジック)】
http://analogic.jp/arrow-function/

【ES6の新機能「Arrow Function」を使って、よりシンプルなコードを書こう | ES6のある星に生まれて】
https://liginc.co.jp/277527

【アロー関数の個人的なハマりどころまとめ - Qiita】
http://qiita.com/you21979@github/items/1f521e4f23e1b989827d

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2016/12/29 11:12

    ありがとうございます!これらの記事を読んでみます!

    キャンセル

+2

他の方が回答されているように、アロー演算子と思われますが、
このコードをアロー演算子を使わない形に直しても、このコードでは動きません。
参照しているコードなどがありましたら、もう少し前後のコードを貼ってみてはいかがでしょうか。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2016/12/29 13:33

    ありがとうございます、はってみます

    キャンセル

  • 2016/12/29 14:51

    貼りなおされたコードを見てみましたが、関数名が呼ばれていなかったり、定義されていなかったりするようです。
    恐らく、自作の関数などを混ぜてよくわからなくなってきたのかと思いますので、
    肝心の
    getColorExと、それを呼び出すstyle_01、style_01に渡す引数であるfeatureに絞って、
    もう一度質問を立て直してみてはいかがでしょう。
    getColorExがうまく呼び出されるようになれば、次はstyle_01を呼び出す条件を組み立てていけばよいでしょう。

    キャンセル

  • 2016/12/30 02:54

    ありがとうございます、よくわからなくなってしまったので、やり直そうと思います。

    キャンセル

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 89.52%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる