My first D3 map showing my travel across the US. This visualization was built by modifying choropleth example code by Scott Murray, tooltip example code by Malcolm Maclean, and legend code example by Mike Bostock.
package com.dummy.dummydata.filter; | |
import com.dummy.dummydata.pojo.*; | |
import com.google.gson.Gson; | |
import com.netflix.servo.jsr166e.ThreadLocalRandom; | |
import com.netflix.zuul.ZuulFilter; | |
import com.netflix.zuul.context.RequestContext; | |
import org.springframework.stereotype.Component; | |
import org.springframework.util.StreamUtils; |
import org.springframework.beans.factory.annotation.Autowired; | |
import org.springframework.boot.autoconfigure.web.servlet.error.AbstractErrorController; | |
import org.springframework.boot.autoconfigure.web.servlet.error.ErrorViewResolver; | |
import org.springframework.boot.web.servlet.error.ErrorAttributes; | |
import org.springframework.boot.web.servlet.error.ErrorController; | |
import org.springframework.http.HttpStatus; | |
import org.springframework.http.ResponseEntity; | |
import org.springframework.web.bind.annotation.RequestMapping; | |
import org.springframework.web.bind.annotation.RestController; |
Aardvark | |
Aardwolf | |
African Buffalo | |
African Elephant | |
African Leopard | |
Albatross | |
Alligator | |
Alpaca | |
Alpaca | |
American Buffalo (bison) |
<!DOCTYPE html> | |
<head> | |
<style> | |
body { | |
display: flex; | |
justify-content: center; | |
align-items: center; | |
height: 100vh; | |
flex-direction: column; | |
} |
CATF44LT7C-eyJsaWNlbnNlSWQiOiJDQVRGNDRMVDdDIiwibGljZW5zZWVOYW1lIjoiVmxhZGlzbGF2IEtvdmFsZW5rbyIsImFzc2lnbmVlTmFtZSI6IiIsImFzc2lnbmVlRW1haWwiOiIiLCJsaWNlbnNlUmVzdHJpY3Rpb24iOiJGb3IgZWR1Y2F0aW9uYWwgdXNlIG9ubHkiLCJjaGVja0NvbmN1cnJlbnRVc2UiOmZhbHNlLCJwcm9kdWN0cyI6W3siY29kZSI6IklJIiwicGFpZFVwVG8iOiIyMDIwLTAxLTA4In0seyJjb2RlIjoiQUMiLCJwYWlkVXBUbyI6IjIwMjAtMDEtMDgifSx7ImNvZGUiOiJEUE4iLCJwYWlkVXBUbyI6IjIwMjAtMDEtMDgifSx7ImNvZGUiOiJQUyIsInBhaWRVcFRvIjoiMjAyMC0wMS0wOCJ9LHsiY29kZSI6IkdPIiwicGFpZFVwVG8iOiIyMDIwLTAxLTA4In0seyJjb2RlIjoiRE0iLCJwYWlkVXBUbyI6IjIwMjAtMDEtMDgifSx7ImNvZGUiOiJDTCIsInBhaWRVcFRvIjoiMjAyMC0wMS0wOCJ9LHsiY29kZSI6IlJTMCIsInBhaWRVcFRvIjoiMjAyMC0wMS0wOCJ9LHsiY29kZSI6IlJDIiwicGFpZFVwVG8iOiIyMDIwLTAxLTA4In0seyJjb2RlIjoiUkQiLCJwYWlkVXBUbyI6IjIwMjAtMDEtMDgifSx7ImNvZGUiOiJQQyIsInBhaWRVcFRvIjoiMjAyMC0wMS0wOCJ9LHsiY29kZSI6IlJNIiwicGFpZFVwVG8iOiIyMDIwLTAxLTA4In0seyJjb2RlIjoiV1MiLCJwYWlkVXBUbyI6IjIwMjAtMDEtMDgifSx7ImNvZGUiOiJEQiIsI
license: mit |
<!DOCTYPE html> | |
<head> | |
<link href="https://fonts.googleapis.com/css?family=Open+Sans&display=swap" rel="stylesheet"> | |
<style> | |
body { | |
display: flex; | |
flex-direction: column; | |
justify-content: center; | |
align-items: center; |
const fetchMachine = Machine({ | |
id: 'fetch', | |
initial: 'incomplete', | |
context: { | |
retries: 0 | |
}, | |
states: { | |
incomplete: { | |
on: { | |
COMPLETE_ORDER: 'pendingPayment' |