Code Monkey home page Code Monkey logo

tableworks's Introduction

tableworks's People

Contributors

r0binxp avatar

Stargazers

avatar santy avatar

Watchers

James Cloos avatar avatar

tableworks's Issues

Markers should indicate users info

Description

When I see the map I can not select markers or know what they represent.

Kapture.2021-09-15.at.15.09.32.mp4

Suggestion

Please add a way to visualize the data already on the store:

tableworks/src/store.jsx

Lines 13 to 148 in bc5310b

const usersData = [
{
id: "1",
firstName: "Jose Luis",
LastName: "Perez",
email: "[email protected]",
dni: 28534292,
creationDate: '20-12-2019',
address: 'San Luis 2050',
location: {
lat: -32.94663832618656,
lng: -60.65214082839065,
},
access: [
{location:"Argentina", date: 'December 25, 2020 23:15:30'},
{location:"Peru", date: 'December 20, 2020 23:15:30'},
{location:"Bolivia", date: 'October 15, 2020 23:15:30'},
]},
{
id: "2",
firstName: "Raul",
LastName: "Alderete",
email: "[email protected]",
dni: 25535222,
creationDate: '15-08-2019',
address: 'Dean Funes 985',
location: {
lat: -32.976097462171055,
lng: -60.6438664135545,
},
access: [
{location:"Chile", date: 'September 30, 2020 23:15:30'},
{location:"Chile", date: 'September 20, 2020 23:15:30'},
{location:"Chile", date: 'September 15, 2020 23:15:30'},
]},
{
id: "3",
firstName: "Maria Laura",
LastName: "Adriani",
email: "[email protected]",
dni: 5457123,
creationDate: '10-05-2019',
address: 'Navarro 6224',
location: {
lat: -32.931310,
lng: -60.707500,
},
access: [
{location:"Usa", date: 'December 25, 2020 23:15:30'},
{location:"Chile", date: 'December 20, 2020 23:15:30'},
{location:"Pery", date: 'October 15, 2020 23:15:30'},
]},
{
id: "4",
firstName: "Xavier",
LastName: "Pertuzi",
email: "[email protected]",
dni: 25487523,
creationDate: '05-01-2018',
address: '1 de Mayo 1300',
location: {
lat: -32.95410626224765,
lng: -60.631345513554884,
},
access: [
{location:"Argentina", date: 'December 25, 2020 23:15:30'},
{location:"Peru", date: 'December 20, 2020 23:15:30'},
{location:"Bolivia", date: 'October 15, 2020 23:15:30'},
]},
{
id: "5",
firstName: "Juan",
LastName: "Heredia",
email: "[email protected]",
dni: 34768943,
creationDate: '09-12-2020',
address: 'Av. Provincias Unidas 1303',
location: {
lat: -32.94334,
lng: -60.71243,
},
access: [
{location:"Argentina", date: 'December 09, 2020 14:30:13'},
]},
{
id: "6",
firstName: "Pamela",
LastName: "Rodriguez",
email: "[email protected]",
dni: 20674896,
creationDate: '15-05-2019',
address: 'Pasco 1220',
location: {
lat: -32.95896,
lng: -60.64305,
},
access: [
{location:"Argentina", date: 'May 15, 2019 16:15:13'},
{location:"Argentina", date: 'December 18, 2019 12:17:00'}
]},
{
id: "7",
firstName: "Agustina",
LastName: "Tutolomondi",
email: "[email protected]",
dni: 47073787,
creationDate: '26-09-2012',
address: 'San Juan 4440',
location: {
lat: -32.94169,
lng: -60.68475,
},
access: [
{location:"Argentina", date: 'September 25, 2012 23:15:13'},
{location:"Chile", date: 'March 20, 2015 11:20:00'}
]},
{
id: "8",
firstName: "Mateo",
LastName: "Uliassi",
email: "[email protected]",
dni: 31530687,
creationDate: '02-10-2017',
address: 'Juan José Paso 5030',
location: {
lat: -32.91950,
lng: -60.69410,
},
access: [
{location:"Argentina", date: 'October 25, 2017 20:15:13'},
{location:"Brazil", date: 'January 12, 2019 19:26:00'}
]},
]

I would expect to show at least an email

Checklist

  • Each marker in the map has a way to identify the user it represents, for example showing the email in any way.
  • Clicking in another marker hides the previous user info and shows the info of the selected marker.
  • Clicking outside of the map or clicking in an area not belonging to a marker should hide previous information about the marker.
  • Previous functionality works as before.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.