コンテンツにスキップ

Attribution

Mapray JS を利用するには Mapray の図形・文字商標(以下、ワードマーク)及び、テキストによる著作権表示の両方を行う必要があります。

  • 左下:ワードマーク表示
  • 右下:テキストによる著作権表示

ワードマーク表示

Mapray のワードマークは Mapray の図形・文字商標になります。 デフォルトの状態で画面の左下にワードマークが表示されます。 Mapray JS の機能を呼び出すことで、画面の別の端に移動することも可能です。 Mapray を利用しているソフトウェア・コンテンツであることがわかるようにワードマークを表示してください。

ワードマークは画面サイズの横幅が文字商標を表示するのに十分でない場合に限り、図形商標のみの表示とすることができます。 デフォルトの状態で Mapray JS が自動的にワードマークサイズを切り替えて表示します。

ワードマークは以下の CSS をロードすると自動的に画面に表示されます。 また npm でも提供されますので環境に合わせてご選択ください。

<link rel="stylesheet" href="https://resource.mapray.com/styles/v1/mapray.css">

テキストによる著作権表示

テキストによる著作権表示は少なくとも、以下の3つのリンクが必要になります。

b と c は Mapray Cloud が配信する地形データを利用する際に必要です。 c に関して、 測量法第29条の規定に基づく承認取扱要領 の第4条に記載されている通り、表記が困難である場合は説明のページや説明書等への記載も認められます。

上記の著作権表示は Mapray JS がデフォルトで自動的に表示を行うようになっておりますが、 Mapray Cloud の地形データを利用しない場合は表示する必要はありません。 詳細は AttributionController を参照してください。

地形データの改変・複製について

Mapray Cloud が配信するデータは当社が測量法第29条により許可を得て作成・配信しているものであり、複製・改変を行うことはできません。 当該地形データは当社の著作物であり権利は当社にあると同時に、測量法第29条により国土地理院からの利用規約上、ユーザーの皆様が当社の地形データを複製することは認められておりません。

著作表示の追加

オープンデータ、有償データにかかわらず、地理空間情報関連のデータを Mapray 上に表示する場合は、各データ提供元の利用規約に沿ってデータを利用する必要があります。 AttributionController を利用することで、簡単に著作権表示を追加することができます。

サンプルコード

AttributionController を使い、著作権表示を追加表示する例を示します。

このサンプルコードでは、<a href="http://sample/">©Sample</a> というhtml要素を追加して著作権表示します。html要素のため、リンクを設定しています(URLはダミーです)。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <script src="https://resource.mapray.com/mapray-js/v0.9.6/mapray.min.js"></script>
        <script src="https://resource.mapray.com/ui/v0.9.6/maprayui.min.js"></script>
        <link rel="stylesheet" href="https://resource.mapray.com/styles/v1/mapray.css">
        <style>
            html, body, div#mapray-container { margin: 0; padding: 0; height: 100%; }
        </style>
    </head>

    <body>
        <div id="mapray-container"></div>
    </body>
</html>

<script>
    // Set up your API Key, which can be created in Mapray Cloud.
    const apikey = "<YOUR_MAPRAY_API_KEY>";

    // The StandardUIView in the ui package includes mouse-based camera manipulation.
    const uiviewer = new maprayui.StandardUIViewer( "mapray-container", apikey);

    uiviewer.viewer.attribution_controller.addAttribution( `<a href="http://sample/">©Sample</a>` );
</script>

Info

このサンプルコードは、<YOUR_MAPRAY_API_KEY>を、あなたのMapray CloudアカウントのAPI Keyに置き換えるまで、期待通りに動作しません。