Skip to content

Commit

Permalink
update 'web-map-custom-element' namespace to -> mapml (#146)
Browse files Browse the repository at this point in the history
  • Loading branch information
AliyanH authored Aug 21, 2024
1 parent c6aea69 commit eb146c2
Show file tree
Hide file tree
Showing 19 changed files with 46 additions and 46 deletions.
2 changes: 1 addition & 1 deletion README.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
# web-map-element documentation

![Sync Repositories](https://github.com/Maps4HTML/Web-Map-Custom-Element/workflows/Sync%20Repositories/badge.svg)
![Sync Repositories](https://github.com/Maps4HTML/MapML.js/workflows/Sync%20Repositories/badge.svg)

## What is the `<mapml-viewer>` and `<layer->` element suite?

Expand Down
16 changes: 8 additions & 8 deletions docs/building.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,8 @@ As an alternative to installing a published version of the library with npm, you
Clone the project using git:

```bash
$ git clone https://github.com/Maps4HTML/Web-Map-Custom-Element.git web-map-custom-element
Cloning into 'web-map-custom-element'...
$ git clone https://github.com/Maps4HTML/MapML.js.git MapML.js
Cloning into 'MapML.js'...
remote: Enumerating objects: 23005, done.
remote: Counting objects: 100% (959/959), done.
remote: Compressing objects: 100% (472/472), done.
Expand All @@ -26,13 +26,13 @@ $
Change directories, into the cloned directory and run "npm install" to install the project's development dependencies:

```bash
prushfor@DESKTOP-8T9A8T8 MINGW64 ~/Documents/web-map-custom-element (main)
$ cd web-map-custom-element
prushfor@DESKTOP-8T9A8T8 MINGW64 ~/Documents/MapML.js (main)
$ cd MapML.js
$ npm install --legacy-peer-deps
...
added 976 packages from 513 contributors and audited 978 packages in 33.576s

prushfor@DESKTOP-8T9A8T8 MINGW64 ~/Documents/web-map-custom-element (main)
prushfor@DESKTOP-8T9A8T8 MINGW64 ~/Documents/MapML.js (main)
$
```

Expand Down Expand Up @@ -64,14 +64,14 @@ Running "uglify:dist" (uglify) task

Done.

prushfor@DESKTOP-8T9A8T8 MINGW64 ~/Documents/web-map-custom-element (main)
prushfor@DESKTOP-8T9A8T8 MINGW64 ~/Documents/MapML.js (main)
$
```

As reported by the last command, you should now have a folder named 'dist' in your project directory, containing the build artifacts that are necessary to create Web pages containing maps. You can copy the `dist` folder into your Web site, where you create HTML pages that refer to the root JavaScript module that encompasses the `<mapml-viewer>` custom elements. For example:

```bash
prushfor@DESKTOP-8T9A8T8 MINGW64 ~/Documents/web-map-custom-element/mysite (main)
prushfor@DESKTOP-8T9A8T8 MINGW64 ~/Documents/MapML.js/mysite (main)
$ mkdir mysite
$ cp -r dist mysite
$ cd mysite
Expand All @@ -96,7 +96,7 @@ $ cat > index.html << EOF
</body>
</html>
EOF
prushfor@DESKTOP-8T9A8T8 MINGW64 ~/Documents/web-map-custom-element/mysite (main)
prushfor@DESKTOP-8T9A8T8 MINGW64 ~/Documents/MapML.js/mysite (main)
$
```

Expand Down
2 changes: 1 addition & 1 deletion docs/elements/input.md
Original file line number Diff line number Diff line change
Expand Up @@ -199,7 +199,7 @@ labels, which may be duplicated on adjacent tiles many times over.
<map-input name="tymax" type="location" rel="tile" position="top-left" axis="northing" units="tilematrix" ></map-input>
<map-link rel="tile" tref="https://datacube.services.geo.ca/ows/msi?SERVICE=WMS&REQUEST=GetMap&FORMAT=image/png&TRANSPARENT=TRUE&STYLES=msi-color&VERSION=1.3.0&LAYERS=msi&WIDTH=256&HEIGHT=256&CRS=EPSG:3978&BBOX={txmin},{tymin},{txmax},{tymax}" ></map-link>
<!-- a zoom input is necessary, but that's a bug:
https://github.com/Maps4HTML/Web-Map-Custom-Element/issues/669 -->
https://github.com/Maps4HTML/MapML.js/issues/669 -->
<map-input name="z" type="zoom" value="25" min="0" max="25"></map-input>
</map-extent>
</layer->
Expand Down
2 changes: 1 addition & 1 deletion docs/elements/web-map.md
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@ To experiment with the `web-map` and `map-area` custom elements, you should link

In theory, if you take steps to provide the fallback markup, a normal (progressive) Web map experience will be had by most users, while those using an older browser or perhaps even Safari may get the "fallback" client side image map experience.

An older example of such a Web map may be found in the [blog post on Progressive Web Maps](https://maps4html.org/Web-Map-Custom-Element/blog/progressive-web-maps.html). Please raise an [issue](https://github.com/Maps4HTML/Web-Map-Custom-Element/issues) if you have comments about how that example works for you.
An older example of such a Web map may be found in the [blog post on Progressive Web Maps](https://maps4html.org/MapML.js/blog/progressive-web-maps.html). Please raise an [issue](https://github.com/Maps4HTML/MapML.js/issues) if you have comments about how that example works for you.

## Attributes

Expand Down
12 changes: 6 additions & 6 deletions docs/installation.md
Original file line number Diff line number Diff line change
Expand Up @@ -16,14 +16,14 @@ import TabItem from '@theme/TabItem';
<TabItem value="jsDelivr" label="jsDelivr">

```html
<script type="module" src="https://cdn.jsdelivr.net/npm/@maps4html/web-map-custom-element/dist/mapml-viewer.js"></script>
<script type="module" src="https://cdn.jsdelivr.net/npm/@maps4html/mapml/dist/mapml-viewer.js"></script>
```

</TabItem>
<TabItem value="unpkg" label="unpkg">

```html
<script type="module" src="https://unpkg.com/@maps4html/web-map-custom-element/dist/mapml-viewer.js"></script>
<script type="module" src="https://unpkg.com/@maps4html/mapml/dist/mapml-viewer.js"></script>
```

</TabItem>
Expand All @@ -36,23 +36,23 @@ To install the `<mapml-viewer>` in your web site project, you use the Node Packa
```bash
$ cd ../test

$ npm install @maps4html/web-map-custom-element
$ npm install @maps4html/mapml

+ @maps4html/[email protected]
+ @maps4html/mapml
added 1 package from 2 contributors and audited 1 package in 1.605s
found 0 vulnerabilities

$
```

Once installation is complete, you will have a node_modules/@maps4html/web-map-custom-element subdirectory, containing a `dist` folder with the required JavaScript, CSS and HTML files to support the `<mapml-viewer>`.
Once installation is complete, you will have a node_modules/@maps4html/mapml subdirectory, containing a `dist` folder with the required JavaScript, CSS and HTML files to support the `<mapml-viewer>`.

#### Add the Script to a Web page

Add the following to the `<head>` of your HTML code:

```html
<script type="module" src="./node_modules/@maps4html/web-map-custom-element/dist/mapml-viewer.js"></script>
<script type="module" src="./node_modules/@maps4html/mapml/dist/mapml-viewer.js"></script>
```

You can now use `<mapml-viewer>`, `<layer->` and the other elements described here on your web pages.
Expand Down
2 changes: 1 addition & 1 deletion docs/layers/static-images.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,5 +5,5 @@ slug: /layers/static-images
---

:::caution
Needs To Be Implemented, Refer To Github Issue [#261](https://github.com/Maps4HTML/Web-Map-Custom-Element/issues/261)
Needs To Be Implemented, Refer To Github Issue [#261](https://github.com/Maps4HTML/MapML.js/issues/261)
:::
4 changes: 2 additions & 2 deletions docs/tutorials/getting-started.md
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,7 @@ You have learned how to include resources like images in your web page, and now
<head>
<title>My First Web Map</title>
// highlight-next-line
<script type="module" src="https://cdn.jsdelivr.net/npm/@maps4html/web-map-custom-element/dist/mapml-viewer.js" crossorigin></script>
<script type="module" src="https://cdn.jsdelivr.net/npm/@maps4html/mapml/dist/mapml-viewer.js" crossorigin></script>
</head>
<body>
<p>Web pages are easy-peasy</p>
Expand All @@ -82,7 +82,7 @@ The next step in our lesson is to remove the image and replace it with a map, us
<html>
<head>
<title>My First Web Map</title>
<script type="module" src="https://cdn.jsdelivr.net/npm/@maps4html/web-map-custom-element/dist/mapml-viewer.js" crossorigin></script>
<script type="module" src="https://cdn.jsdelivr.net/npm/@maps4html/mapml/dist/mapml-viewer.js" crossorigin></script>
</head>
<body>
<p>Web <s>pages</s> maps are easy-peasy</p>
Expand Down
2 changes: 1 addition & 1 deletion docs/tutorials/quick-start.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ Learn how to quickly create your first map.
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Getting Started</title>
<script type="module" src="https://cdn.jsdelivr.net/npm/@maps4html/web-map-custom-element/dist/mapml-viewer.js"></script>
<script type="module" src="https://cdn.jsdelivr.net/npm/@maps4html/mapml/dist/mapml-viewer.js"></script>
</head>
<body>
<mapml-viewer width="800" height="400" projection="OSMTILE" zoom="1" lat="60.0" lon="-100.0" controls>
Expand Down
2 changes: 1 addition & 1 deletion docusaurus.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ module.exports = {
position: 'right'
},
{
href: 'https://github.com/Maps4HTML/Web-Map-Custom-Element',
href: 'https://github.com/Maps4HTML/MapML.js',
label: 'GitHub',
position: 'right',
},
Expand Down
16 changes: 8 additions & 8 deletions i18n/fr/docusaurus-plugin-content-docs/current/building.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,8 @@ Plutôt que d’installer la version publiée de la bibliothèque avec npm, vous
Clonez le projet à l’aide du logiciel Git :

```bash
$ git clone https://github.com/Maps4HTML/Web-Map-Custom-Element.git web-map-custom-element
Cloning into 'web-map-custom-element'...
$ git clone https://github.com/Maps4HTML/MapML.js.git MapML.js
Cloning into 'MapML.js'...
remote: Enumerating objects: 23005, done.
remote: Counting objects: 100% (959/959), done.
remote: Compressing objects: 100% (472/472), done.
Expand All @@ -26,13 +26,13 @@ $
Changez les répertoires dans le répertoire cloné et exécutez la commande « npm install » pour installer les dépendances relatives au développement du projet :

```bash
prushfor@DESKTOP-8T9A8T8 MINGW64 ~/Documents/web-map-custom-element (main)
$ cd web-map-custom-element
prushfor@DESKTOP-8T9A8T8 MINGW64 ~/Documents/MapML.js (main)
$ cd MapML.js
$ npm install --legacy-peer-deps
...
added 976 packages from 513 contributors and audited 978 packages in 33.576s

prushfor@DESKTOP-8T9A8T8 MINGW64 ~/Documents/web-map-custom-element (main)
prushfor@DESKTOP-8T9A8T8 MINGW64 ~/Documents/MapML.js (main)
$
```

Expand Down Expand Up @@ -64,14 +64,14 @@ Running "uglify:dist" (uglify) task

Done.

prushfor@DESKTOP-8T9A8T8 MINGW64 ~/Documents/web-map-custom-element (main)
prushfor@DESKTOP-8T9A8T8 MINGW64 ~/Documents/MapML.js (main)
$
```

Comme indiqué par la dernière commande, votre répertoire de projet devrait maintenant contenir un dossier intitulé ‘dist’, lequel contient les artéfacts de compilation nécessaires à la création de pages Web contenant des cartes. Vous pouvez copier le dossier `dist` dans votre site Web où vous créez les pages HTML qui renvoient au module JavaScript racine comprenant les éléments personnalisés `<mapml-viewer>`. Par exemple :

```bash
prushfor@DESKTOP-8T9A8T8 MINGW64 ~/Documents/web-map-custom-element/mysite (main)
prushfor@DESKTOP-8T9A8T8 MINGW64 ~/Documents/MapML.js/mysite (main)
$ mkdir mysite
$ cp -r dist mysite
$ cd mysite
Expand All @@ -96,7 +96,7 @@ $ cat > index.html << EOF
</body>
</html>
EOF
prushfor@DESKTOP-8T9A8T8 MINGW64 ~/Documents/web-map-custom-element/mysite (main)
prushfor@DESKTOP-8T9A8T8 MINGW64 ~/Documents/MapML.js/mysite (main)
$
```

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -142,7 +142,7 @@ Les WMS peuvent être lents à réagir, même s’ils le font rapidement en réa
<map-input name="tymax" type="location" rel="tile" position="top-left" axis="northing" units="tilematrix" ></map-input>
<map-link rel="tile" tref="https://datacube.services.geo.ca/ows/msi?SERVICE=WMS&REQUEST=GetMap&FORMAT=image/png&TRANSPARENT=TRUE&STYLES=msi-color&VERSION=1.3.0&LAYERS=msi&WIDTH=256&HEIGHT=256&CRS=EPSG:3978&BBOX={txmin},{tymin},{txmax},{tymax}" ></map-link>
<!—il faut préciser un niveau de zoom, mais il s’agit d’un bogue :
https://github.com/Maps4HTML/Web-Map-Custom-Element/issues/669 -->
https://github.com/Maps4HTML/MapML.js/issues/669 -->
<map-input name="z" type="zoom" value="25" min="0" max="25"></map-input>
</map-extent>
</layer->
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@ Pour expérimenter les éléments personnalisés `web-map` et `map-area`, vous d

En théorie, si vous prenez des mesures pour fournir un balisage alternatif, la plupart des utilisateurs auront une expérience normale (progressive) avec la carte Web, tandis que ceux qui utilisent un ancien navigateur ou même Safari pourraient obtenir une expérience inverse avec l’image cliquable côté client.

Pour obtenir un exemple antérieur d’une telle carte Web, veuillez consulter cet [article de blogue sur les cartes Web progressives](https://maps4html.org/Web-Map-Custom-Element/blog/progressive-web-maps.html). Veuillez soulever un [problème](https://github.com/Maps4HTML/Web-Map-Custom-Element/issues) si vous souhaitez faire part de vos commentaires sur le fonctionnement de cet exemple.
Pour obtenir un exemple antérieur d’une telle carte Web, veuillez consulter cet [article de blogue sur les cartes Web progressives](https://maps4html.org/MapML.js/blog/progressive-web-maps.html). Veuillez soulever un [problème](https://github.com/Maps4HTML/MapML.js/issues) si vous souhaitez faire part de vos commentaires sur le fonctionnement de cet exemple.

## Attributs

Expand Down
12 changes: 6 additions & 6 deletions i18n/fr/docusaurus-plugin-content-docs/current/installation.md
Original file line number Diff line number Diff line change
Expand Up @@ -16,14 +16,14 @@ import TabItem from '@theme/TabItem';
<TabItem value="jsDelivr" label="jsDelivr">

```html
<script type="module" src="https://cdn.jsdelivr.net/npm/@maps4html/web-map-custom-element/dist/mapml-viewer.js"></script>
<script type="module" src="https://cdn.jsdelivr.net/npm/@maps4html/mapml/dist/mapml-viewer.js"></script>
```

</TabItem>
<TabItem value="unpkg" label="unpkg">

```html
<script type="module" src="https://unpkg.com/@maps4html/web-map-custom-element/dist/mapml-viewer.js"></script>
<script type="module" src="https://unpkg.com/@maps4html/mapml/dist/mapml-viewer.js"></script>
```

</TabItem>
Expand All @@ -36,23 +36,23 @@ Pour installer les éléments `<mapml-viewer>` dans votre projet de site Web, vo
```bash
$ cd ../test

$ npm install @maps4html/web-map-custom-element
$ npm install @maps4html/mapml

+ @maps4html/[email protected]
+ @maps4html/mapml
added 1 package from 2 contributors and audited 1 package in 1.605s
found 0 vulnerabilities

$
```

Une fois l’installation terminée, le sous-répertoire node_modules/@maps4html/web-map-custom-element sera créé, lequel contient un dossier `dist` avec les fichiers JavaScript, CSS et HTML requis pour prendre en charge les éléments `<mapml-viewer>`.
Une fois l’installation terminée, le sous-répertoire node_modules/@maps4html/mapml sera créé, lequel contient un dossier `dist` avec les fichiers JavaScript, CSS et HTML requis pour prendre en charge les éléments `<mapml-viewer>`.

#### Ajouter le script à une page Web

Ajoutez ce qui suit à l’élément `<head>` de votre code HTML :

```html
<script type="module" src="./node_modules/@maps4html/web-map-custom-element/dist/mapml-viewer.js"></script>
<script type="module" src="./node_modules/@maps4html/mapml/dist/mapml-viewer.js"></script>
```

Vous pouvez maintenant utiliser dans vos pages Web les éléments `<mapml-viewer>` et `<layer->` ainsi que les autres éléments décrits dans le présent document.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,5 +5,5 @@ slug: /layers/static-images
---

:::caution
Needs To Be Implemented, Refer To Github Issue [#261](https://github.com/Maps4HTML/Web-Map-Custom-Element/issues/261)
Needs To Be Implemented, Refer To Github Issue [#261](https://github.com/Maps4HTML/MapML.js/issues/261)
:::
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,7 @@ Maintenant que vous avez appris comment inclure des ressources telles que des im
<head>
<title>Ma première Carte Web</title>
// highlight-next-line
<script type="module" src="https://cdn.jsdelivr.net/npm/@maps4html/web-map-custom-element/dist/mapml-viewer.js" crossorigin></script>
<script type="module" src="https://cdn.jsdelivr.net/npm/@maps4html/mapml/dist/mapml-viewer.js" crossorigin></script>
</head>
<body>
<p>Les pages Web: c'est si facile</p>
Expand All @@ -82,7 +82,7 @@ La prochaine étape est de supprimer et remplacer l'image par une carte, en util
<html>
<head>
<title>Ma première Carte Web</title>
<script type="module" src="https://cdn.jsdelivr.net/npm/@maps4html/web-map-custom-element/dist/mapml-viewer.js" crossorigin></script>
<script type="module" src="https://cdn.jsdelivr.net/npm/@maps4html/mapml/dist/mapml-viewer.js" crossorigin></script>
</head>
<body>
<p>Les <s>pages</s> cartes Web : c'est si facile</p>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ Apprenez à créer rapidement votre première carte.
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Getting Started</title>
<script type="module" src="https://cdn.jsdelivr.net/npm/@maps4html/web-map-custom-element/dist/mapml-viewer.js"></script>
<script type="module" src="https://cdn.jsdelivr.net/npm/@maps4html/mapml/dist/mapml-viewer.js"></script>
</head>
<body>
<mapml-viewer width="800" height="400" projection="OSMTILE" zoom="1" lat="60.0" lon="-100.0" controls>
Expand Down
2 changes: 1 addition & 1 deletion i18n/fr/docusaurus-theme-classic/footer.json
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@
},
"link.item.label.GitHub": {
"message": "GitHub",
"description": "The label of footer link with label=GitHub linking to https://github.com/Maps4HTML/Web-Map-Custom-Element"
"description": "The label of footer link with label=GitHub linking to https://github.com/Maps4HTML/MapML.js"
},
"copyright": {
"message": "Copyright © 2022 Maps4HTML. Construit avec Docusaurus.",
Expand Down
4 changes: 2 additions & 2 deletions src/pages/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -126,13 +126,13 @@ function Home() {
<p>
<Translate id="mapml.HomePageContent.GetInvolved.PullRequests">
The custom element suite is an open source project. Anyone who wants to submit changes/fixes is welcomed to doing so through Pull Requests to our </Translate>
<Link to="https://github.com/Maps4HTML/Web-Map-Custom-Element">
<Link to="https://github.com/Maps4HTML/MapML.js">
<Translate id="mapml.HomePageContent.GetInvolved.GitHub.PullRequests.linkText"> Github Repository</Translate></Link>.
</p>
<p>
<Translate id="mapml.HomePageContent.GetInvolved.GitHub.Issues.1">
You can also contribute by reporting any bugs or issues while using the element suite in the form of one or more </Translate>
<Link to="https://github.com/Maps4HTML/Web-Map-Custom-Element/issues">
<Link to="https://github.com/Maps4HTML/MapML.js/issues">
<Translate id="mapml.HomePageContent.GetInvolved.GitHub.Issues.linkText"> issues</Translate>
</Link>
<Translate id="mapml.HomePageContent.GetInvolved.GitHub.Issues.2"> on the same repository</Translate>.
Expand Down
2 changes: 1 addition & 1 deletion static/demo/Tutorial/Getting Started/index.html
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<html>
<head>
<title>My First Web Map</title>
<script type="module" src="https://cdn.jsdelivr.net/npm/@maps4html/web-map-custom-element/dist/mapml-viewer.js" crossorigin></script>
<script type="module" src="https://cdn.jsdelivr.net/npm/@maps4html/mapml/dist/mapml-viewer.js" crossorigin></script>
</head>
<body>
<p>Web <s>pages</s> maps are easy-peasy</p>
Expand Down

0 comments on commit eb146c2

Please sign in to comment.