2f:[] 2d:{"title":"Surfline API exploration","cells":[{"id":0,"value":"md`# Surfline API exploration`","pinned":false,"hidden":false,"mode":"ojs"},{"id":250,"value":"html `\n

A quick exploration of the Surfline API 2.0

Used the meta-surf-forecast repo as a starting point

And updated with suggestions from Toph Tucker who found solution to some bugs! Note to Toph: Tried to merge your suggestions directly but failed, so had to manually paste stuff over but it was useful.

\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":407,"value":"html `

NOTE: Looks like this approach no longer works and this notebook will need to be redone.

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":166,"value":"last_month_chart = vegalite({\n \"width\": 820,\n \"height\": 120,\n title:\"Predicted Min/Max Surf Height\",\n data: {values: just_data_plus_date,\n \"format\": {\n \"parse\": {\"date\": \"utc:'%Y-%m-%d\"+\"T\"+\"%H:%M'\"}\n }\n },\n // \"transform\": [\n // {\"fold\": [\"surf_min\", \"surf_max\"]}\n // ],\n mark: \"rule\",\n encoding: {\n x: {timeUnit: \"yearsmonthsdayshoursminutes\", field: \"time_text\", type: \"temporal\"},\n // y: {\"field\": \"value\", \"type\": \"quantitative\"},\n y: {field: \"surf.min\", type: \"quantitative\"},\n y2: {field: \"surf.max\", type: \"quantitative\"},\n color: {\"field\": \"surf_optimalScore\", \"type\": \"ordinal\",\"scale\": {\n scheme: \"accent\"\n }\n }\n }\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":17,"value":"map = {\n const container = html`

`;\n yield container;\n \n const map = L.map(container).setView([location[\"lat\"], location[\"lon\"]], 10);\n L.tileLayer(\"https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png\", {\n attribution: \"© OpenStreetMap contributors\"\n }).addTo(map)\n \n const location_marker = new L.marker([location[\"lat\"], location[\"lon\"]]).addTo(map).bindPopup(\"

location type: location

model name: LOLA

\")\n const forecastLocation_marker = new L.marker([forecastLocation[\"lat\"], forecastLocation[\"lon\"]]).addTo(map).bindPopup(\"

location type: forecast

model name: LOLA

\")\n const offshoreLocation_marker = new L.marker([offshoreLocation[\"lat\"], forecastLocation[\"lon\"]]).addTo(map).bindPopup(\"

location type: offshore

model name: LOLA

\")\n \n \n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":361,"value":"html `Change the location by inputting a different spot ID here`","pinned":false,"hidden":false,"mode":"ojs"},{"id":262,"value":"viewof spotid = Inputs.text({label: \"Surfline Location Spot ID\", placeholder: \"Enter a Surfline spotID\", value: \"5842041f4e65fad6a7708dae\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":325,"value":"html `

The default is Shidashita Beach where the 2021 Olympics surfing competition is being held, which is the spot id 5842041f4e65fad6a7708dae. Interestingly, the \"offshore location\" for Shidashita beach is actually onshore. I'm not sure if that's a mistake or a side effect of something?

Also check out the lahaina-harbor-breakwall in Maui, Hawaii 5842041f4e65fad6a7708b37

and 37th Street Galveston, Texas USA 5842041f4e65fad6a7708b8d\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":331,"value":"html `To find the spot ID of a surf location, look at the surfline webpage URL for it.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":371,"value":"html `

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":281,"value":"html `

The actual surfline page for Shidashita Beach, where 2021 Olympics are held, is shown below. The URL is https://www.surfline.com/surf-report/shidashita-beach/5842041f4e65fad6a7708dae and the spot_id is 5842041f4e65fad6a7708dae

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":269,"value":"html `