mahish / mapy-usmrceni Goto Github PK

Histogram gives better overview to user where are interesting results. Partially, he get the answers to his questions in advance.

Possible use:

• with sliding scale for age (see the attached picture)
• show amount of deads for each year within the selected period
• …

Example (airbnb.com)

When page is loaded, by default, the item 136 is selected and its output data are written in info box.

I suggest no item should be selected on load by default. Or, when selected, its marker must be an active marker.

Add credits

• [email protected]
• www.ustrcr.cz

and link to the electronic attachement of the book

• www.zelezna-opona.cz

UI není vůbec kompatibilní s IE.

Vizuálně ho je nutné poladit i pro Firefox.

We need to tell to user that he can click on marker to see more markers which are overlapping.

• button for All occurences — initial state is to show all of them and we need an option to get back to that state
• pseudo-discrete slider — we operate with four discrete time periods. We have to make this clear.

I pushed (e2a39f8) missing gender data to our source .csv file. (found it in another file)

I have to add reset button for gender filter and uncheck the options as a default state.

Spiderfy works only on maximum map zoom maxZoom.
Clusters works only on lower levels of zoom maxZoom - 1.
Max map zoom have to be set. Maybe set maxZoom: 15?
We need to set zoom event listener to be able to change between spider and cluster without redraw all markers.

Potřeboval bych propojit map-svg-overlap.js s map-custom.js tedy kód pro SVG overlay integrovat do hlavního JS souboru. Jedná se o branch SVG-overlap.

Dík.

Make possible to deselect an active marker, on second click for example.

Let user define precise age with manual input.

More interesting points via http://baymard.com/blog/slider-interfaces

Klustery využíváme pro body, které spolu sdílejí identickou pozici. V realitě šlo o skupinky, které se snažili přejít hranici dohromady a byli pravděpodobně zabití ve stejnou chvíli na stejném místě. Skupiny jsou pravděpodobně vždy jen o několika pár členech.

Tudíž potřebujeme, aby úrovně klusterů (v defaultu vizuelně odlišené modrou-žlutou-červenou… ikonkou) byli vždy jen n+1 nikoli na základě rovnice z markerclusterer.js řádek 347:

/**
 *  The function for calculating the cluster icon image.
 *
 *  @param {Array.<google.maps.Marker>} markers The markers in the clusterer.
 *  @param {number} numStyles The number of styles available.
 *  @return {Object} A object properties: 'text' (string) and 'index' (number).
 *  @private
 */
MarkerClusterer.prototype.calculator_ = function(markers, numStyles) {
  var index = 0;
  var count = markers.length;
  var dv = count;
  while (dv !== 0) {
    dv = parseInt(dv / 10, 10);
    index++;
  }

  index = Math.min(index, numStyles);
  return {
    text: count,
    index: index
  };
};

Close this issue with commit named close #13.

Správné souřadnice jsou:

49° 45' = 49.75 (decimální)
15° 30' = 15.50 (decimální)

Close this issue with commit named close #12.

V případě několika bodů s identickou pozicí dochází k tomu, že uživatel není schopen zobrazit (tzn- kliknout, najet myší…) informaci o bodu, který neleží na vrchu této skupinky. Klustery tento problém pravděpodobně ještě více komplikují.

Close this issue with commit named close #14.

Mapbox has now 100%. Should be 100% - top bars.

When i decide to close the infobox in the right bottom corner of the screen. Would be great if the selected marker get unselected.

We need to assign GPS values ( latlng data ) to administrative areas. It is called Reverse Geocoding.

Because we have a final set of data, it would be wise to run some script and to add new variable(s) in advance and serve these data packed alrdy in our JSON.

instead of:

    "gps_bydliste":"49.740692,13.38834",
    "gps_incidentu":"49.898947,12.550136",

we add two new variables ( i used this to get the okres data which is administrative_area_level_2):

    "gps_bydliste":"49.740692,13.38834", // actually we dont need this
    "okres_bydliste":"Plzeň-město",
    "gps_incidentu":"49.898947,12.550136", // but we still need this
    "okres_incidentu":"Tachov",

So to speak, we need to parse our current JSON thru some script with the geocode api.

Je třeba vymyslet způsob, jak na mapu navázat další informační vrstvu, která by zobrazovala jednotlivé okresy, které se navíc v jednotlivých období mohou lišit.

Bude to pravděpodobně SVG. To je třeba na mapu nějak umístit. Podobu SVG jde lehce upravovat pomocí CSS navázaného na nějaký JS event. Např.: https://parall.ax/blog/view/2985/tutorial-creating-an-interactive-svg-map

Primirně by měly okresy zobrazovat informaci o počtu usmrcených narozených v daném okrese. Dál by bylo vhodné, aby jednotlivé okresy reagovali na uživatele a příp. mu i nabízeli (po najetí myše) další info.

Pracuju se ségrou na tom, abysme měli ideálně strukturované a čisté SVG.

Download histrocikých dat: http://web.natur.cuni.cz/ksgrrsek/urrlab_vystupy/download

Would be nice to try: marker gets gray instead of disappearing completely when it doesn't fit to selected category/value in any of active filters.

Gives context and comparison as an additional information value.

Od roku 1948 do roku 1989 se dá daná problematika dělit do 4 fází. Naším úkolem tedy je dát možnost uživateli zobrazit úmrtí na hranicích jen v daných fázích pokud si to bude přát. K tomu je zapotřebí interface, který bude funkčně propojený se zobrazovanými daty.

Dané fáze jsou:

• 1948-1950
• 1951-1965
• 1966-1971
• 1972-1989

Zda by to mělo být pomocí slideru, checklistu nebo záložek, zjistím a rozhodnu do příštího týdne. Je ale třeba asi nejdřív říct, jak to udělat a zda jsme toho vůbec schopni (jsme!).

We can show the welcome screen only once per session using sessionstorage and not bother the visitor (AND developer) with the instructions every time he refreshes a page.

Lets make filtrable:

• age — slider
• sex — radio
• nationality — dropdown
• place of residence / of birth (county) — dropdown
• place of incident (county or brigade) — dropdown
• way of death — dropdown

Thus, we need a new box either for the additional filters or for the informations about a selected marker.

At first, Ill prepare basic UI. Then, Radim will make it functional. Eventually, Ill make final UI based on real interaction experience.

Velkým bonusem by bylo, kdyby šlo ze stejných dat generovat nejen mapové vizualizace ale např. i sloupcové grafy apod. A ideálně mít mapu i grafy na stejné stránce.

Mělo by se na to myslet při výběru způsobu a toolů k řešení momentálně aktuálnějších úkolů.

To see active marker and so to see to which marker belongs info from infobox.

After we added the info box functionality, the period filter doesnt show relevant output.

We need more deadly and the same time more sexy markers!

In main.js, instead of:

sliderAge.noUiSlider.on('change', function(){ …

should be

sliderAge.noUiSlider.on('update', function(){ …

But it doesn work for me:(
http://refreshless.com/nouislider/slider-values/#section-non-linear-step

If user has selected marker and infobox visible clicking the reset filter deselects the marker but keeps the infobox open.

Present stat:

Working example:
http://jsfiddle.net/mahish/nn3a55hu/

I would like to try how is it like when I click on a marker map centers on it. It is important function considering the infobox.

It would be nice to have button which reset map zoom to its initial state.

Zobrazit další info o daném bodě po najetí myše/po kliknutí na něj.

"vek_h": "24",
        "statni_prislusnost": "československo - čsr, čssr",
        "gps_bydliste": "49.740692,13.38834",
        "gps_incidentu": "49.898947,12.550136",
        "smer_prechodu": "neurčeno",
        "umrti": "příčinou úmrtí byla střelba pohraničníků, případně příslušní",
        "obdobi_incidentu": "1948 - 1950",
        "rok": 1949

V první fázi stačí do native gmaps bubliny. V další fázi zvážíme zda info nezobrazovat ve speciálním boxu jinde na stránce.

Close this issue with commit close #10.

Most of a values are between 20-30 years of age. To make it easier to navigate we can try to make the slider non-linear http://refreshless.com/nouislider/slider-values/#section-non-linear , something like that:

range: {
    'min': [  5, 1 ], // 5 years old, step by 1 year
    '30%': [ 20, 1 ], // 20 years old, step by 1 year
    '60%': [ 30, 1 ], // 30 years old, step by 1 year
    'max': [ 90, 1 ]  // 90 years old, step by 1 year
}

see branch https://github.com/mahish/Mapy-usmrceni/tree/non-linear-slider-(issue-%2352)

SVG overlap administrativních map nekopíruje tvar hranic Česka v Google mapách.

Chyba je pravděpodobně v rozdílném systému souřadnic. Google používá Mercator projection based on the World Geodetic System (WGS) 1984 (http://support.esri.com/cn/knowledgebase/techarticles/detail/34749). Okresy budou SJTSK, ale jke asi nutné se na to zeptat.

Period filter remains visually activated (red color) after clicking filter reset button. Do we actually want to reset the period filter. Originally, I intended the reset filter button to not affect the period filter.

Show user the information about how many markers are on the map.

1. design @mahish
2. function @sevcikra

People are trying to grab scroll bars instead of scrolling with mouse wheels.

Na jednom místě se může vyskytnout více bodů a ty potom nejde vizuálně odlišit. Proto by bylo dobré nějakým způsobem zvýraznit počet bodů ve stejné lokaci v závislosti na úrovni přibližení. Např. pomocí clusterů: https://googlemaps.github.io/js-marker-clusterer/docs/examples.html

I would delete the ref folder and move any unnecessary folders and files for the app from data folder to Dropbox.

Make the 'Application' button more visible and noticeable.

Přesunout data z javascriptového souboru do samostatného JSONa.

Close this issue with commit named close #11.

Im having troubles with cloning the repository to my Windows 10 machine. Eventually, I succeeded. However, Im still receiving some errors and Im unable to checkout and switch to dev.

Let's make the readme page more eye-catching ;)

1/ translate the intro to English
2/ add some screenshot from the app
3/ use some basic styling

RS

If a user filters data points by e.g. age. the dropdown options later down should also update to reflect only options that are available based on filtered data.