184 | {map ? children : null}
185 |
186 | {children}
,
39 | );
40 | const icon = getDomMarkerIcon(html);
41 | newMarker = new H.map.DomMarker({ lat, lng }, { icon });
42 | } else if (bitmap) {
43 | const icon = getMarkerIcon(bitmap);
44 |
45 | newMarker = new H.map.Marker({ lat, lng }, { icon });
46 | } else {
47 | newMarker = new H.map.Marker({ lat, lng });
48 | }
49 |
50 | if (draggable && behavior) {
51 | newMarker.draggable = draggable;
52 | setMarkerDragEvent(map, behavior);
53 | }
54 |
55 | map.addObject(newMarker);
56 | setMarker(newMarker);
57 | }
58 | return () => {
59 | if (map && marker) {
60 | map.removeObject(marker);
61 | }
62 | };
63 | }, [bitmap, children, draggable, lat, lng, mapContext, marker]);
64 |
65 | React.useEffect(() => {
66 | if (marker) {
67 | Object.entries(events).forEach(([event, hereEvent]) => {
68 | const e = rest[event as keyof Events];
69 | if (typeof e === 'function') {
70 | marker.addEventListener(hereEvent, e);
71 | }
72 | });
73 | }
74 | return () => {
75 | if (marker) {
76 | Object.entries(events).forEach(([event, hereEvent]) => {
77 | const e = rest[event as keyof Events];
78 | if (typeof e === 'function') {
79 | marker.removeEventListener(hereEvent, e);
80 | }
81 | });
82 | }
83 | };
84 | }, [marker, rest]);
85 |
86 | React.useEffect(() => {
87 | if (marker && lat && lng) {
88 | marker.setPosition({
89 | lat,
90 | lng,
91 | });
92 | }
93 | }, [lat, lng, marker]);
94 |
95 | return null;
96 | };
97 |
98 | export default Marker;
99 |
--------------------------------------------------------------------------------
/src/RouteLine.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 |
3 | import MapContext from './utils/map-context';
4 |
5 | type Shape = string[];
6 |
7 | export interface RouteLineProps extends H.map.Polyline.Options {
8 | strokeColor?: string;
9 | lineWidth?: number;
10 | shape: Shape;
11 | }
12 |
13 | export const RouteLine: React.FC
41 |
42 |
50 |
51 | );
52 | }
53 |
54 | module.exports = Help;
55 |
--------------------------------------------------------------------------------
/website/pages/en/index.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright (c) 2017-present, Facebook, Inc.
3 | *
4 | * This source code is licensed under the MIT license found in the
5 | * LICENSE file in the root directory of this source tree.
6 | */
7 |
8 | const React = require('react');
9 |
10 | const CompLibrary = require('../../core/CompLibrary.js');
11 |
12 | const Container = CompLibrary.Container;
13 | const GridBlock = CompLibrary.GridBlock;
14 |
15 | class HomeSplash extends React.Component {
16 | render() {
17 | const { siteConfig, language = '' } = this.props;
18 | const { baseUrl, docsUrl } = siteConfig;
19 | const docsPart = `${docsUrl ? `${docsUrl}/` : ''}`;
20 | const langPart = `${language ? `${language}/` : ''}`;
21 | const docUrl = doc => `${baseUrl}${docsPart}${langPart}${doc}`;
22 |
23 | const SplashContainer = props => (
24 |
43 |
44 |
46 |
49 | Need help?
45 |This project is maintained by a dedicated group of people.
47 |
25 |
29 | );
30 |
31 | const Logo = props => (
32 |
26 |
28 | {props.children}
27 |
33 | 
34 |
35 | );
36 |
37 | const ProjectTitle = () => (
38 | 39 | {siteConfig.title} 40 | {siteConfig.tagline} 41 |
42 | ); 43 | 44 | const PromoSection = props => ( 45 |
46 |
50 | );
51 |
52 | const Button = props => (
53 |
47 |
49 | {props.children}
48 |
54 |
55 | {props.children}
56 |
57 |
58 | );
59 |
60 | return (
61 |
64 |
66 |
69 |
70 |
71 |
72 |
118 |
123 | );
124 | }
125 | }
126 |
127 | module.exports = Index;
128 |
--------------------------------------------------------------------------------
/website/pages/en/users.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright (c) 2017-present, Facebook, Inc.
3 | *
4 | * This source code is licensed under the MIT license found in the
5 | * LICENSE file in the root directory of this source tree.
6 | */
7 |
8 | const React = require('react');
9 |
10 | const CompLibrary = require('../../core/CompLibrary.js');
11 |
12 | const Container = CompLibrary.Container;
13 |
14 | class Users extends React.Component {
15 | render() {
16 | const {config: siteConfig} = this.props;
17 | if ((siteConfig.users || []).length === 0) {
18 | return null;
19 | }
20 |
21 | const editUrl = `${siteConfig.repoUrl}/edit/master/website/siteConfig.js`;
22 | const showcase = siteConfig.users.map(user => (
23 |
24 |
120 |
122 |
30 |
31 |
43 |
44 | );
45 | }
46 | }
47 |
48 | module.exports = Users;
49 |
--------------------------------------------------------------------------------
/website/sidebars.json:
--------------------------------------------------------------------------------
1 | {
2 | "docs": {
3 | "Introduction": ["introduction/installation"],
4 | "API Reference": [
5 | "api/here-map",
6 | "api/marker",
7 | "api/routeline",
8 | "api/circle",
9 | "api/use-platform"
10 | ]
11 | }
12 | }
13 |
--------------------------------------------------------------------------------
/website/siteConfig.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright (c) 2017-present, Facebook, Inc.
3 | *
4 | * This source code is licensed under the MIT license found in the
5 | * LICENSE file in the root directory of this source tree.
6 | */
7 |
8 | // See https://docusaurus.io/docs/site-config for all the possible
9 | // site configuration options.
10 |
11 | // List of projects/orgs using your project for the users page.
12 | // const users = [
13 | // {
14 | // caption: 'User1',
15 | // You will need to prepend the image path with your baseUrl
16 | // if it is not '/', like: '/test-site/img/image.jpg'.
17 | // image: '/img/undraw_open_source.svg',
18 | // infoLink: 'https://www.facebook.com',
19 | // pinned: true,
20 | // },
21 | // ];
22 |
23 | const siteConfig = {
24 | title: 'React Here Maps', // Title for your website.
25 | tagline: 'React components library for HERE Maps',
26 | url: 'https://ordazgustavo.github.io', // Your website URL
27 | baseUrl: '/here-maps-react/', // Base URL for your project */
28 | // For github.io type URLs, you would set the url and baseUrl like:
29 | // url: 'https://facebook.github.io',
30 | // baseUrl: '/test-site/',
31 |
32 | // Used for publishing and more
33 | projectName: 'here-maps-react',
34 | organizationName: 'ordazgustavo',
35 | // For top-level user or org sites, the organization is still the same.
36 | // e.g., for the https://JoelMarcey.github.io site, it would be set like...
37 | // organizationName: 'JoelMarcey'
38 |
39 | // For no header links in the top nav bar -> headerLinks: [],
40 | headerLinks: [
41 | { doc: 'introduction/installation', label: 'Docs' },
42 | { doc: 'api/here-map', label: 'API' },
43 | { page: 'help', label: 'Help' },
44 | {
45 | href: 'https://github.com/ordazgustavo/here-maps-react',
46 | label: 'GitHub',
47 | },
48 | ],
49 |
50 | // If you have users set above, you add it here:
51 | // users,
52 |
53 | /* path to images for header/footer */
54 | headerIcon: 'img/logo-white.png',
55 | footerIcon: 'img/logo.png',
56 | favicon: 'img/favicon.ico',
57 |
58 | /* Colors for website */
59 | colors: {
60 | primaryColor: '#65C1C2',
61 | secondaryColor: '#393E47',
62 | },
63 |
64 | /* Custom fonts for website */
65 | /*
66 | fonts: {
67 | myFont: [
68 | "Times New Roman",
69 | "Serif"
70 | ],
71 | myOtherFont: [
72 | "-apple-system",
73 | "system-ui"
74 | ]
75 | },
76 | */
77 |
78 | // This copyright info is used in /core/Footer.js and blog RSS/Atom feeds.
79 | copyright: `Copyright © ${new Date().getFullYear()} ordazgustavo`,
80 |
81 | highlight: {
82 | // Highlight.js theme to use for syntax highlighting in code blocks.
83 | theme: 'default',
84 | },
85 |
86 | // Add custom scripts here that would be placed in
32 |
42 |
33 |
36 | Who is Using This?
34 |This project is used by many folks
35 |{showcase}
37 | Are you using this project?
38 | 39 | Add your company 40 | 41 |