2017-01-25 24 views
7

yüksek çizelgeleri tepki ve bunların kodlanmış olması gibi/harita verileri kaydedilmiş görünüyor: küçük bir çok görüyorumDünya haritası yolları verileri Ben tepki highmaps belgelerine bakıyorum

https://github.com/kirjs/react-highcharts https://github.com/kirjs/react-highcharts/tree/master/demo/src/mapdata

veri sadece bu

mapData: Highcharts.maps['custom/world'], 
gibi bir anahtar geçirerek yüksek haritaların içinden gelmesi

burada örneğe bakın olsa öğreticiler: http://jsfiddle.net/gh/get/jquery/3.1.1/highcharts/highcharts/tree/master/samples/maps/tooltip/usehtml/

012 Saf Dünya haritaları için yol verilerini çekmek için tepki bir yolu varsa

Ama saf reactJS/nodeJS app yazıyorum göz önüne alındığında, merak ediyorum? Bu bir yerde yüksek haritalar tepki dağıtıldığı? Göre

+0

Sorunuzu anlayabildiğimden emin değilim. Highcharts reaksiyonundaki bir haritaya ait veriler, gerekliyse içe aktarılmaya hazır bir nesnedir. Yani buna ihtiyacınız varsa, onu düzenli bir modül olarak içe aktarın. – morganfree

+0

Yüksek çizelgeleri yüklemek için npm kullandığımda Highcharts.maps nesnesi boş. – es3735746

cevap

5

official Highcharts documentation harita komut dosyasını dahil manuel zorunda:

Kısacası

, haritanın GeoJSON sürümü sayfa bir komut etiketinde yüklenir. Bu GeoJSON nesne daha sonra Highcharts.maps nesneye kayıtlı ve grafik kurulumunda mapData seçeneği uygulanır. Yukarıdaki senaryo dahil bir harita Highcharts.maps['custom/world'] mevcut olduğu için

<script src="https://code.highcharts.com/mapdata/custom/world.js"></script> 

: Eğer söz the fiddle görebileceğiniz gibi

da senaryo etiketiyle harita dahil.

React modülünde, bahsettiğiniz demoda olduğu gibi istediğiniz haritaları elle eklemeniz gerekir. Sonra Dünya haritası, eklemek istediğiniz Örneğin,:

  1. buradan alın: https://code.highcharts.com/mapdata/custom/world.js
  2. yukarıdaki dosyada module.exports = ile Highcharts.maps["custom/world"] = değiştirin.
  3. const map = require('./maps/world');
  4. Sonra mapData: map

Ben yukarıdaki işlemi atlamak istiyorsanız anlıyoruz config başvurabilir, ancak şu anda herhangi içeren modülü tepki yok senin bileşeninde haritayı yükleyin harita.


Aslında world.js komut dosyası etiketi içerebilir, orada dahildir sen ... bunu komut tepki html dosyasında, bir hackish yolu yoktur, ama önce emin olmak zorunda Highcharts.maps nesne dizisi mevcuttur. Bu moda size haritaları harici kullanacağız.

Ancak, React bileşenleriniz bu harita komut dosyasına bağlı olacağından, bu bir hatalı uygulama'dur.

İyi uygulama paket yöneticisi aracılığıyla satıcı modüllerini yönetmek ve bileşenlerindeki modülleri başvurmak etmektir.Bu şekilde, bileşenler kendi tanımlayıcı

+0

Teşekkürler! Bu tam olarak sorduğum şey. Üzgünüm bunu yapmanın bir yolu yok! – es3735746

+0

@ es3735746 aslında yapabileceğiniz hack bir yol var ... Tepki komut dosyalarının yer aldığı html dosyanızda, world.js komut dosyası etiketini içerebilir, ancak önce "Highcharts.maps" nesne dizisi var. Bu şekilde haritalar harici olarak kullanacaksınız. Ancak ** bu kötü bir uygulamadır ** çünkü React bileşenleriniz bu harita betiğine bağlı olacaktır. ** İyi uygulama **, satıcı modüllerinizin paket yöneticisi aracılığıyla yönetilmesi ve bileşenlerde bulunan modüllere referans verilmesidir. Bu şekilde - bileşenler kendi kendini tanımlayıcıdır. –