I'm going around in circles and going mad at the same time -- trying
to understand how to express one to many relationships in EXHIBIT
using 3 separate tables / JSON feed(s) as source.
here's the set-up: I am working with items: Parks, Facilities &
Washrooms
a Park: can have 1....n Facilities
a Park: can have 1....n Washrooms
I'd like to keep the feed structure similar to the one below (vs.
"nesting" subsets of items under 1 item) because that's how the source
data arrives. The relationships are currently expressed as:
Facilities.ParkID <--> Parks.ID and Washrooms.ParkID <--> Parks.ID
where Parks.ID is the "key"
The purpose of the Exhibit is to show view of Parks (with lists of
facilities, washrooms for each) that would update based on filters
from all 3 item types.
Here's my feed:
http://www.editgrid.com/user/nikg/ParkTest.exhibit.jsonp
editgridCallback({"items":[
{"type":"Park","id":"1","label":"Arbutus Village
Park","Neighbourhood":"Arbutus
Ridge","Facilities":"Y","SpecialFeatures":"N","Washrooms":"N"},
{"type":"Park","id":"2","label":"Carnarvon
Park","Neighbourhood":"Downtown","Facilities":"Y","SpecialFeatures":"N","Washrooms":"Y"},
{"type":"Park","id":"6","label":"Quilchena Park","Neighbourhood":"West
End","Facilities":"Y","SpecialFeatures":"Y","Washrooms":"Y"},
{"type":"Facility","ParkID":"1","FacilityCount":"1","FacilityType":"Playgrounds","label":"Park
ID1 Playgrounds"},
{"type":"Facility","ParkID":"2","FacilityCount":"1","FacilityType":"Field
Houses","label":"Park ID2 Field Houses"},
{"type":"Facility","ParkID":"2","FacilityCount":"2","FacilityType":"Playgrounds","label":"Park
ID2 Playgrounds"},
{"type":"Facility","ParkID":"6","FacilityCount":"4","FacilityType":"Softball","label":"Park
ID6 Softball"},
{"type":"Washroom","ParkID":"1","Location":"West side, field
house","SummerHours":"Dawn to Dusk","WinterHours":"Dawn to
Dusk","label":"Park ID1 Washroom at West side, field house"},
{"type":"Washroom","ParkID":"2","Location":"North east corner,
fieldhouse","Notes":"Caretaker on site","SummerHours":"Dawn to
Dusk","WinterHours":"Dawn to Dusk","label":"Park ID2 Washroom at North
east corner, fieldhouse"},
{"type":"Washroom","ParkID":"2","Location":"North side,
fieldhouse","Notes":"Caretaker on site","SummerHours":"Dawn to
Dusk","WinterHours":"Dawn to Dusk","label":"Park ID2 Washroom at North
side, fieldhouse"},
{"type":"Washroom","ParkID":"6","Location":"South side,
fieldhouse","SummerHours":"12:00 pm - 4:00 pm","WinterHours":"12:00 pm
- 4:00 pm","label":"Park ID6 Washroom at South side, fieldhouse"},
{"type":"Washroom","ParkID":"6","Location":"West
side","SummerHours":"10:00 am - Dusk","WinterHours":"10:00 am -
Dusk","label":"Park ID6 Washroom at West side"}
]})
So, Park id 2 / label "Carnarvon Park" has 2 facilities: Field Houses,
count of 1 and Playgrounds, count of 2 as well as 2 Washrooms.
The intended behaviour is to filter parks based on selection of facets
on the right (e.g. Clicking on Playgrounds under "FacilityType" facet
should filter our parks, leaving only parks 1 and 2).
Here's the HTML:
<html>
<head>
<title>Vancouver Parks Exhibit | BETA</title>
<script src="
http://api.simile-widgets.org/exhibit/2.2.0/exhibit-
api.js"
type="text/javascript"></script>
<link href="parktestschema.js" type="application/json" rel="exhibit/
data" />
<link rel="exhibit/data" type="application/jsonp"
ex:converter="convert"
href="
http://www.editgrid.com/user/nikg/
ParkTest.exhibit.jsonp"
jsonp-callback="editgridCallback" />
</head>
<body>
<div ex:role="collection" id="Park-collection" ex:itemTypes="Park"></
div>
<div ex:role="collection" id="Facility-collection"
ex:itemTypes="Facility"></div>
<div ex:role="collection" id="Washroom-collection"
ex:itemTypes="Washroom"></div>
<h1>Vancouver Parks Exhibit</h1>
<table width="100%">
<tr valign="top">
<td ex:role="viewPanel">
<div ex:role="view"
ex:collectionID="Park-collection"
ex:showAll="false"
ex:grouped="false"
ex:orders=".label, .NeighbourhoodName"
ex:directions="descending"
ex:possibleOrders=".label, .NeighbourhoodName"
></div>
</td>
<td width="25%">
<div ex:role="facet"
ex:facetClass="TextSearch"
ex:facetLabel="Search Parks:"
ex:collectionID="Park-collection"
></div>
<br />
<div ex:role="facet"
ex:expression=".NeighbourhoodName" ex:facetLabel="Neighbourhood:"
ex:collectionID="Park-collection"></div>
<div ex:role="facet" ex:expression=".Facilities"
ex:facetLabel="Has Facilities?" ex:collectionID="Park-collection"></
div>
<div ex:role="facet" ex:expression=".FacilityType"
ex:facetLabel="Facilities:" ex:collectionID="Facility-collection"></
div>
<div ex:role="facet" ex:expression=".SummerHours"
ex:facetLabel="Washroom Hours:" ex:collectionID="Washroom-
collection"></div>
</div>
</td>
</tr>
</table>
</body>
</html>
Help anyone?