title: How to bind JSON data to noUiSlider?
body: <p>this is my first time using noUiSlider and I am stuck on how to bind the data from my json file to pass to the slider and filter my result.
  I am returning values from wp db in form of json data as follow:</p>
  
  <pre><code>0:
  price:"100"
  carat:"0.70"
  clarity:"VVS2"
  color:"D"
  condition:"good"
  1:
  price:"20"
  carat:"0.30"
  clarity:"VF1"
  color:"F"
  condition:"Excellent"
  </code></pre>
  
  <p>As you see some of key values are strings.
  I am planning to make one slider for each key.
  How do I set the min and max and all other values in between to equals or loop through my key values from the json values?
  I am using the following format from php:</p>
  
  <pre><code>$json_array = array();
  var myData = json_encode($json_array);
  </code></pre>
  
  <p>These are just sample data, I just stuck at the binding section. How do I loop through all my colors for example {D, F, G, D, E, A} or condition {excellent, good, very good, bad}. In nouiSlider its all integers and I am sure somehow these key values correspond to that array?</p>
  
  <p>Thanks in advance for your help.</p>