Coder Social home page Coder Social logo

erdigokce / turkey-map-react Goto Github PK

View Code? Open in Web Editor NEW
67.0 2.0 9.0 985 KB

An out-of-the-box city map of Turkey for React JS applications.

Home Page: https://www.npmjs.com/package/turkey-map-react

License: MIT License

TypeScript 99.71% JavaScript 0.29%
react turkey turkey-cities turkeymap

turkey-map-react's People

Contributors

dependabot[bot] avatar erdemgonul avatar erdigokce avatar ritzykey avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

turkey-map-react's Issues

Kıbrıs eksik kalmış

Kıbrıs'ı da ekler misiniz? Bu plugin'in jquery versiyonunda vardı. isterseniz kodunu ekleyebilirim buraya

Changing city color

Hello Erdi,

How can I change city color by plateNumber. I don't want to change color of the all cities.

County Map When A City is Clicked

Introduction

When a city is clicked on the map there is no default behavior as the version of "v1.1.1". For majority of use cases can cover county base actions.

When a city clicked, a county map of the city can be displayed on a popup. This behavior can be enabled by a prop which is not present by default.

County data (built-in or custom) has to be explicitly imported in order to reduce bundle size when not used.

This release will not be backward compatible due to the current data prop has been changed.

Must Haves

  • Built-in county list has to be provided.
  • Current data prop will be renamed as cities.
  • A new prop named counties which accepts county data. This prop is undefined by default.
  • On click to a city, opacity of the Turkey Map will be reduced to .75 and City Map will be painted on top of the Turkey Map with centered vertically and horizontally.

Introduced In

v2.0.0

ReferenceError: document is not defined

using with Next.js

Server Error
ReferenceError: document is not defined

This error happened while generating the page. Any console logs will be displayed in the terminal window.
Call Stack
Object.C.exports [as insertStyleElement]
file:///Users/selcuk/weather-app/node_modules/turkey-map-react/lib/index.js (2:9961)
Object.C.exports [as domAPI]
file:///Users/selcuk/weather-app/node_modules/turkey-map-react/lib/index.js (2:10174)
n
file:///Users/selcuk/weather-app/node_modules/turkey-map-react/lib/index.js (2:9095)
r
file:///Users/selcuk/weather-app/node_modules/turkey-map-react/lib/index.js (2:8981)
C.exports
file:///Users/selcuk/weather-app/node_modules/turkey-map-react/lib/index.js (2:9317)
<unknown>
file:///Users/selcuk/weather-app/node_modules/turkey-map-react/lib/index.js (2:11805)

Error: Minified React error #130 after deploy

Everything working fine at local. After deploy getting this error.
https://weather.selcukguler.com/
https://github.com/selcukguler0/weather_app

index.99339086.js:32 Uncaught Error: Minified React error #130; visit https://reactjs.org/docs/error-decoder.html?invariant=130&args[]=object&args[]= for the full message or use the non-minified dev environment for full errors and additional helpful warnings.
    at Tn (index.99339086.js:32:49682)
    at y (index.99339086.js:30:17372)
    at We (index.99339086.js:32:1494)
    at to (index.99339086.js:32:44706)
    at Z0 (index.99339086.js:32:40003)
    at Ou (index.99339086.js:32:39931)
    at rr (index.99339086.js:32:39785)
    at _5 (index.99339086.js:32:36120)
    at E9 (index.99339086.js:32:36932)
    at w2 (index.99339086.js:30:3274)
Tn @ index.99339086.js:32
y @ index.99339086.js:30
We @ index.99339086.js:32
to @ index.99339086.js:32
Z0 @ index.99339086.js:32
Ou @ index.99339086.js:32
rr @ index.99339086.js:32
_5 @ index.99339086.js:32
E9 @ index.99339086.js:32
w2 @ index.99339086.js:30
(anonymous) @ index.99339086.js:32

Default Tooltip To Display City Names On Hover

New Feature: Default Tooltip On Hover City

As of version 1.0.3, the only built-in behavior is that the hovered city area is colored. There is no default behavior for displaying city names on hover.

Implementation Scope

  • - A tooltip component named "Tooltip" is to be implemented.
  • - This default tooltip component has to be enabled by "showTooltip (boolean)" prop which is false by default in order to keep existing uses not affected.
  • - The tooltip has to be shown on top-right corner of the cursor with offsets (left: 16px, top: -32px) on hover.
  • - The tooltip is stylized with black background and white text color by default.
  • - The tooltip text can be customized by a prop named as "tooltipText".
  • - Update README.
  • - Prepare CHANGELOG.

Version

This feature will be released in "1.1.0" as minor feature version.

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.