knitr::opts_chunk$set( collapse = TRUE, comment = "#>" )
I have always loved this post Tufte in R, so I thought with it would be a great example for our new data-ui
sparkline abilities.
library(dataui) library(htmltools) library(dplyr) library(tidyr) library(scales) library(RCurl)
I get the data as the post suggest but change the code to use readr
and adjust for new tidyr
and dplyr
API.
# recreate http://motioninsocial.com/tufte/ in dataui # get data and make it long form dd <- readr::read_csv( paste0( "http://gist.githubusercontent.com/GeekOnAcid/da022affd36310c96cd4/", "raw/9c2ac2b033979fcf14a8d9b2e3e390a4bcc6f0e3/us_nr_of_crimes_1960_2014.csv" ) ) %>% pivot_longer( cols = 2:(ncol(dd)), names_to = "Crime.Type", values_to = "Crime.Rate" )
# source "http://gist.githubusercontent.com/GeekOnAcid/da022affd36310c96cd4/raw/9c2ac2b033979fcf14a8d9b2e3e390a4bcc6f0e3/us_nr_of_crimes_1960_2014.csv" dd <- structure(list(Year = c(1960, 1960, 1960, 1960, 1960, 1960, 1960, 1960, 1960, 1960, 1961, 1961, 1961, 1961, 1961, 1961, 1961, 1961, 1961, 1961, 1962, 1962, 1962, 1962, 1962, 1962, 1962, 1962, 1962, 1962, 1963, 1963, 1963, 1963, 1963, 1963, 1963, 1963, 1963, 1963, 1964, 1964, 1964, 1964, 1964, 1964, 1964, 1964, 1964, 1964, 1965, 1965, 1965, 1965, 1965, 1965, 1965, 1965, 1965, 1965, 1966, 1966, 1966, 1966, 1966, 1966, 1966, 1966, 1966, 1966, 1967, 1967, 1967, 1967, 1967, 1967, 1967, 1967, 1967, 1967, 1968, 1968, 1968, 1968, 1968, 1968, 1968, 1968, 1968, 1968, 1969, 1969, 1969, 1969, 1969, 1969, 1969, 1969, 1969, 1969, 1970, 1970, 1970, 1970, 1970, 1970, 1970, 1970, 1970, 1970, 1971, 1971, 1971, 1971, 1971, 1971, 1971, 1971, 1971, 1971, 1972, 1972, 1972, 1972, 1972, 1972, 1972, 1972, 1972, 1972, 1973, 1973, 1973, 1973, 1973, 1973, 1973, 1973, 1973, 1973, 1974, 1974, 1974, 1974, 1974, 1974, 1974, 1974, 1974, 1974, 1975, 1975, 1975, 1975, 1975, 1975, 1975, 1975, 1975, 1975, 1976, 1976, 1976, 1976, 1976, 1976, 1976, 1976, 1976, 1976, 1977, 1977, 1977, 1977, 1977, 1977, 1977, 1977, 1977, 1977, 1978, 1978, 1978, 1978, 1978, 1978, 1978, 1978, 1978, 1978, 1979, 1979, 1979, 1979, 1979, 1979, 1979, 1979, 1979, 1979, 1980, 1980, 1980, 1980, 1980, 1980, 1980, 1980, 1980, 1980, 1981, 1981, 1981, 1981, 1981, 1981, 1981, 1981, 1981, 1981, 1982, 1982, 1982, 1982, 1982, 1982, 1982, 1982, 1982, 1982, 1983, 1983, 1983, 1983, 1983, 1983, 1983, 1983, 1983, 1983, 1984, 1984, 1984, 1984, 1984, 1984, 1984, 1984, 1984, 1984, 1985, 1985, 1985, 1985, 1985, 1985, 1985, 1985, 1985, 1985, 1986, 1986, 1986, 1986, 1986, 1986, 1986, 1986, 1986, 1986, 1987, 1987, 1987, 1987, 1987, 1987, 1987, 1987, 1987, 1987, 1988, 1988, 1988, 1988, 1988, 1988, 1988, 1988, 1988, 1988, 1989, 1989, 1989, 1989, 1989, 1989, 1989, 1989, 1989, 1989, 1990, 1990, 1990, 1990, 1990, 1990, 1990, 1990, 1990, 1990, 1991, 1991, 1991, 1991, 1991, 1991, 1991, 1991, 1991, 1991, 1992, 1992, 1992, 1992, 1992, 1992, 1992, 1992, 1992, 1992, 1993, 1993, 1993, 1993, 1993, 1993, 1993, 1993, 1993, 1993, 1994, 1994, 1994, 1994, 1994, 1994, 1994, 1994, 1994, 1994, 1995, 1995, 1995, 1995, 1995, 1995, 1995, 1995, 1995, 1995, 1996, 1996, 1996, 1996, 1996, 1996, 1996, 1996, 1996, 1996, 1997, 1997, 1997, 1997, 1997, 1997, 1997, 1997, 1997, 1997, 1998, 1998, 1998, 1998, 1998, 1998, 1998, 1998, 1998, 1998, 1999, 1999, 1999, 1999, 1999, 1999, 1999, 1999, 1999, 1999, 2000, 2000, 2000, 2000, 2000, 2000, 2000, 2000, 2000, 2000, 2001, 2001, 2001, 2001, 2001, 2001, 2001, 2001, 2001, 2001, 2002, 2002, 2002, 2002, 2002, 2002, 2002, 2002, 2002, 2002, 2003, 2003, 2003, 2003, 2003, 2003, 2003, 2003, 2003, 2003, 2004, 2004, 2004, 2004, 2004, 2004, 2004, 2004, 2004, 2004, 2005, 2005, 2005, 2005, 2005, 2005, 2005, 2005, 2005, 2005, 2006, 2006, 2006, 2006, 2006, 2006, 2006, 2006, 2006, 2006, 2007, 2007, 2007, 2007, 2007, 2007, 2007, 2007, 2007, 2007, 2008, 2008, 2008, 2008, 2008, 2008, 2008, 2008, 2008, 2008, 2009, 2009, 2009, 2009, 2009, 2009, 2009, 2009, 2009, 2009, 2010, 2010, 2010, 2010, 2010, 2010, 2010, 2010, 2010, 2010, 2011, 2011, 2011, 2011, 2011, 2011, 2011, 2011, 2011, 2011, 2012, 2012, 2012, 2012, 2012, 2012, 2012, 2012, 2012, 2012, 2013, 2013, 2013, 2013, 2013, 2013, 2013, 2013, 2013, 2013, 2014, 2014, 2014, 2014, 2014, 2014, 2014, 2014, 2014, 2014), Crime.Type = c("Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft", "Total", "Violent", "Property", "Murder", "Rape", "Robbery", "Aggravated-Assault", "Burglary", "Larceny-Theft", "Vehicle-Theft"), Crime.Rate = c(1887.2, 160.9, 1726.3, 5.1, 9.6, 60.1, 86.1, 508.6, 1034.7, 183, 1906.1, 158.1, 1747.9, 4.8, 9.4, 58.3, 85.7, 518.9, 1045.4, 183.6, 2019.8, 162.3, 1857.5, 4.6, 9.4, 59.7, 88.6, 535.2, 1124.8, 197.4, 2180.3, 168.2, 2012.1, 4.6, 9.4, 61.8, 92.4, 576.4, 1219.1, 216.6, 2388.1, 190.6, 2197.5, 4.9, 11.2, 68.2, 106.2, 634.7, 1315.5, 247.4, 2449, 200.2, 2248.8, 5.1, 12.1, 71.7, 111.3, 662.7, 1329.3, 256.8, 2670.8, 220, 2450.9, 5.6, 13.2, 80.8, 120.3, 721, 1442.9, 286.9, 2989.7, 253.2, 2736.5, 6.2, 14, 102.8, 130.2, 826.6, 1575.8, 334.1, 3370.2, 298.4, 3071.8, 6.9, 15.9, 131.8, 143.8, 932.3, 1746.6, 393, 3680, 328.7, 3351.3, 7.3, 18.5, 148.4, 154.5, 984.1, 1930.9, 436.2, 3984.5, 363.5, 3621, 7.9, 18.7, 172.1, 164.8, 1084.9, 2079.3, 456.8, 4164.7, 396, 3768.8, 8.6, 20.5, 188, 178.8, 1163.5, 2145.5, 459.8, 3961.4, 401, 3560.4, 9, 22.5, 180.7, 188.8, 1140.8, 1993.6, 426.1, 4154.4, 417.4, 3737, 9.4, 24.5, 183.1, 200.5, 1222.5, 2071.9, 442.6, 4850.4, 461.1, 4389.3, 9.8, 26.2, 209.3, 215.8, 1437.7, 2489.5, 462.2, 5298.5, 487.8, 4810.7, 9.6, 26.3, 220.8, 231.1, 1532.1, 2804.8, 473.7, 5287.3, 467.8, 4819.5, 8.7, 26.6, 199.3, 233.2, 1448.2, 2921.3, 450, 5077.6, 475.9, 4601.7, 8.8, 29.4, 190.7, 247, 1419.8, 2729.9, 451.9, 5140.4, 497.8, 4642.5, 9, 31, 195.8, 262.1, 1434.6, 2747.4, 460.5, 5565.5, 548.9, 5016.6, 9.8, 34.7, 218.4, 286, 1511.9, 2999.1, 505.6, 5950, 596.6, 5353.3, 10.2, 36.8, 251.1, 298.5, 1684.1, 3167, 502.2, 5858.2, 594.3, 5263.8, 9.8, 36, 258.7, 289.7, 1649.5, 3139.7, 474.7, 5603.7, 571.1, 5032.5, 9.1, 34, 238.9, 289.1, 1488.8, 3084.9, 458.9, 5175, 537.7, 4637.3, 8.3, 33.7, 216.5, 279.2, 1337.7, 2869, 430.8, 5031.3, 539.2, 4492.1, 7.9, 35.7, 205.4, 290.2, 1263.7, 2791.3, 437.1, 5207.1, 556.6, 4650.5, 8, 37.1, 208.5, 302.9, 1287.3, 2901.2, 462, 5480.4, 620.1, 4881.8, 8.6, 38.1, 226, 347.4, 1349.8, 3022.1, 509.8, 5550, 609.7, 4940.3, 8.3, 37.4, 212.7, 351.3, 1329.6, 3081.3, 529.5, 5664.2, 637.2, 5027.1, 8.4, 37.6, 220.9, 370.2, 1309.2, 3134.9, 582.9, 5741, 663.1, 5077.9, 8.7, 38.1, 233, 383.4, 1276.3, 3171.3, 630.4, 5820.3, 731.8, 5088.5, 9.4, 41.2, 257, 424.1, 1235.9, 3194.8, 657.8, 5897.8, 758.1, 5139.7, 9.8, 42.3, 272.7, 433.3, 1252, 3228.8, 658.9, 5660.2, 757.5, 4902.7, 9.3, 42.8, 263.6, 441.8, 1168.2, 3103, 631.5, 5484.4, 746.8, 4737.7, 9.5, 41.1, 255.9, 440.3, 1099.2, 3032.4, 606.1, 5373.5, 713.6, 4660, 9, 39.3, 237.7, 427.6, 1042, 3026.7, 591.3, 5274.9, 684.5, 4591.3, 8.2, 37.1, 220.9, 418.3, 987.1, 3043.8, 560.4, 5087.6, 636.6, 4451, 7.4, 36.3, 201.9, 390.9, 945, 2980.3, 525.7, 4927.3, 611, 4316.3, 6.8, 35.9, 186.1, 382.1, 919.6, 2891.8, 505.7, 4615.5, 566.4, 4049.1, 6.3, 34.4, 165.2, 360.5, 862, 2728.1, 459, 4266.5, 523, 3743.6, 5.7, 32.8, 150.1, 334.3, 770.4, 2550.7, 422.5, 4124.8, 506.5, 3618.3, 5.5, 32, 145, 324, 728.8, 2477.3, 412.2, 4162.6, 504.5, 3658.1, 5.6, 31.8, 148.5, 318.6, 741.8, 2485.7, 430.5, 4125, 494.4, 3630.6, 5.6, 33.1, 146.1, 309.5, 747, 2450.7, 432.9, 4067, 475.8, 3591.2, 5.7, 32.3, 142.5, 295.4, 741, 2416.5, 433.7, 3977.3, 463.2, 3514.1, 5.5, 32.4, 136.7, 288.6, 730.3, 2362.3, 421.5, 3900.5, 469, 3431.5, 5.6, 31.8, 140.8, 290.8, 726.9, 2287.8, 416.8, 3808.1, 473.6, 3334.5, 5.7, 30.9, 149.4, 287.5, 729.4, 2206.8, 398.4, 3730.4, 466.9, 3263.5, 5.6, 30, 147.6, 283.8, 722.5, 2177.8, 363.3, 3669, 457.5, 3211.5, 5.4, 29.7, 145.7, 276.7, 732.1, 2167, 314.7, 3465.5, 431.9, 3036.1, 5, 29.1, 133.1, 264.7, 717.7, 2064.5, 259.2, 3350.4, 404.5, 2945.9, 4.8, 27.7, 119.3, 252.8, 701, 2005.8, 239.1, 3292.5, 387.1, 2905.4, 4.7, 27, 113.9, 241.5, 701.3, 1974.1, 230, 3255.8, 387.8, 2868, 4.7, 27.1, 113.1, 242.8, 672.2, 1965.4, 230.4, 3112.4, 379.1, 2733.3, 4.5, 25.9, 109, 229.6, 610.4, 1901.6, 221.3, 2971.8, 375.7, 2596.1, 4.5, 26.4, 102.2, 232.5, 542.5, 1837.3, 216.2)), row.names = c(NA, -550L), class = c("tbl_df", "tbl", "data.frame"))
This is the easiest and quickest way to get some colors for our plots. I think a splash of color will liven up the sparklines a little bit. However, normally I would spend a little more time selecting colors.
# color by type colscale <- scales::brewer_pal(palette="Set3")(11)[-2]
Now for our graphics pipeline intentionally done in one long pipe. To accomplish a chart similar to the original would have required much less code. Since we have interactivity and some additional options, I wanted to put them to use. Drag your mouse over the chart to see what it can do.
dd %>% group_by(Crime.Type) %>% summarise( # get our band line values quart1 = quantile(Crime.Rate, 0.25), quart2 = quantile(Crime.Rate, 0.75), rate_last = tail(Crime.Rate, 1), # create our sparkline spk = list(dui_sparkline( # ugly but will make this better soon data = mapply( function(year,rate) {list(year = year, rate = rate)}, Year, Crime.Rate, SIMPLIFY = FALSE ), height = 120, margin = list(top = 40, bottom = 20, right = 150, left = 30), # tell sparkline to get rate for y values valueAccessor = htmlwidgets::JS("(d) => d.rate"), # label is easier but tooltip omore flexible renderTooltip = htmlwidgets::JS(htmltools::HTML(" function (_ref) { var datum = _ref.datum; return React.createElement( 'div', {style: {margin: 0, padding: 0}}, datum.year && React.createElement( 'div', {style: { backgroundColor: 'black', color: 'white', padding: '4px 0px', margin: 0, textAlign: 'center' }}, datum.year ), React.createElement( 'div', {style: {fontWeight: 'bold', fontSize: '1.2em', padding: '6px 0'}}, datum.y ? datum.y.toLocaleString(undefined, {maximumFractionDigits: 0}) : \"--\" ) ); } ")), components = list( dui_sparkpatternlines( id = "band_pattern", height = 4, width = 4, stroke = "#aaa", strokeWidth = 1, orientation = "diagonal" ), dui_sparkbandline( band = list(from = list(y=quart1[[1]]), to = list(y=quart2[[1]])), fill = "url(#band_pattern)" ), dui_sparklineseries( stroke = colscale[cur_group_id()] ), # let JavaScript data-ui determine min/max dui_sparkpointseries( points = list("min","max"), fill = colscale[cur_group_id()], renderLabel = htmlwidgets::JS(" (d) => d.toLocaleString(undefined, {maximumFractionDigits: 0}) ") ), dui_sparklabel( label = Crime.Type[[1]], x = 5, y = -20, anchor = "begin", fill = colscale[cur_group_id()], fillOpacity = 1 ), dui_tooltip( components = list( dui_sparkverticalrefline(strokeDasharray="4,4"), dui_sparkpointseries(fill = "#fff", stroke = colscale[cur_group_id()]) ) ) ) )) ) %>% arrange(desc(rate_last)) %>% pull(spk) %>% tagList() # %>% # browsable() %>% # print()
Add the following code to your website.
For more information on customizing the embed code, read Embedding Snippets.